SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Jul 2001
    Location
    Fresno, California
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question A few CSS problems

    I am working on a css layout web project. The home page is currently at:http://www.csufresno.edu/degreeroadmap/test/

    I have a few glitches. In IE the image (#image) doesn't come up. Also, is there a way to have it degrade gracefully in NN4X? Perhaps a hack? As long as it lines up vertically, that will work. Thanks for any help!
    Sites By Robin
    Founded June 2001

  2. #2
    SitePoint Addict BenANFA's Avatar
    Join Date
    Apr 2003
    Location
    Bath, UK
    Posts
    353
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm not sure any of these are the solution but you could try them:
    1. Normally if you float an element then you have to provide a width. This is not true for images (I believe but I could be wrong). However you haven't floated the image, you have floated a div and put an image in it. Try appling the #image id directly to the <img ... > tag and do not encapasulate it in a div.
    2. Height and width should be specified, try setting the height and width attributes of you image.
    3. It's an IE bug to do with floating elements, try adding a position: relative to the #image CSS.


    Hope one of these works, otherwise you'll have to wait for someone better to reply.

  3. #3
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    As for the NN4 degrading, save yourself the headache and @import your stylesheet like so:
    HTML Code:
    <head>
    <style type="text/css" media="screen">
      @import url("/styles.css");
    </style>
    </head>
    NN4 will ignore it.

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,535
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    To make the image show in IE you will need to add position:relative to the images div.

    Code:
    #image { padding: 5px; float: left;position:relative; }
    It's an IE bug that sometimes requires children of positioned elements to have position relative set in order to force them to display (especially images but can happen with text also). (I'm not sure if they get drawn over by the background or what, but adding position relative solves the problem.)

    Paul


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •