SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Addict sdleihssirhc's Avatar
    Join Date
    Feb 2009
    Posts
    387
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Get Floats to Automatically Clear in IE6

    I'm working with definition lists. The term and definition are both one line, and I'd like to get them to display on the same line. My page is located at http://chrisshields.net/test.php

    I'm floating both the dt and the dd to the left, and I'm giving the dt a clear:both rule.

    Here's what I want, and what most browsers seem to do:



    Here's what IE6 does:



    I tried applying zoom:1 to anything and everything, but I can't get IE6 to behave. Any suggestions?

  2. #2
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,623
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Total guess as I've never messed with dd and dts. They remind me of tr and tds. Though I now their nothing alike. Try margin-right:100% instead of clear

  3. #3
    Sploghm bronze trophy Victorinox's Avatar
    Join Date
    Nov 2008
    Posts
    749
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Try this:

    Code CSS:
    dl { 
    padding:1em 1em 0; 
    background:pink; 
    overflow:hidden;
    zoom:1;
    }
     
    dt { 
    float:left; 
    margin-right:.5em; 
    background:lightgreen;
    }
     
    dd { 
    background:lightblue; 
    margin-bottom:1em; 
    }
    Last edited by Victorinox; Mar 24, 2011 at 12:43. Reason: Had left out zoom:1;

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,789
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    I'd also add this extra bit on to Vics code above.

    Code:
    dd {
    background:lightblue;
    margin-bottom:1em;
    overflow:hidden;
    zoom:1.0;
    }
    That will keep the dd in a rectangular block rather than wrapping underneath if the content is longer.

  5. #5
    SitePoint Addict sdleihssirhc's Avatar
    Join Date
    Feb 2009
    Posts
    387
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    I love these forums.

    Victorinox's solution works perfectly. Thanks.


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
  •