SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Oct 2007
    Posts
    42
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    ie5x and 6 errors

    on http://www.phuset.dk/ny/lisbeth/lisbeth.html in ie5x and 6 the .clear {clear:both; height:0} is rendered height:10px approx which disrupts the height of the #businesscard (i have given the .clear a bg-color and a width as well so i can see it, when it is quirky): what do i do?

    in ie5x the img in #businecard is positioned slightly too much to the left - giving #businecard a too large padding-right: can i do anything about that?

    also, the top link wont show its border-bottom before i hover it: what can i do?

    see http://browsershots.org/png/original...4e348ae606.png which i ie5.5

    thanks
    rasmus

  2. #2
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Haven't got time to look at this but the first problem sounds like a common bug in IE6 and below in that it won't render it's height smaller than the base fontsize even if it doesn't contain any text.

    So if you apply font-size: 0; to this .clear, then it should fix the problem

    I'll have a look at your other problems in the morning although someone in Oz or the US may be able to help you before I'm back online.

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

    To make the links show their borders add this:

    Code:
    #menubox a{position:relative;}
    That menubox really should be a list though becasue screen readers will read those adjacent anchors as one sentence without stopping.

    You should never really have anchors separated only by whitespace in the html. That's why a list structure makes double sense because its semantic and provides containers for the anchors.

    As Dave said above there are a number of way to fix the clear problem and you could also use overflow:hidden instead of font-size:0 but either will do.

    Code:
    .clear {
        clear: both;
        height:1px;
        overflow:hidden;
       margin-top:-1px;
    }
    The image looks as though its only 2 px out and I wouldn't really worry about that for ie5.x If it worries you then use the conditional comments to supply ie5.x with this rule:

    Code:
    #businesscard img {
        margin-right:-2px;
        }
    Hope that helps

  4. #4
    SitePoint Enthusiast
    Join Date
    Oct 2007
    Posts
    42
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Poul O'B: your solutions work
    thank you very much
    rasmus
    Last edited by samtaleterapi; Oct 26, 2007 at 08:04.


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
  •