Question about floating in CSS2

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • adventurer
    New Member
    • May 2007
    • 3

    Question about floating in CSS2

    Hello everyone, I am not totaly new to CSS, but I am new to understanding all that css2 has to offer. I am curious about the float and how it works if anyone knows.

    If I make a div container, and then within that div container make several div containers that all float left, is it possible to stack them left to right across the sceen..however many I need? All with auto adjusting to screen size! lol tough..I know..been trying a while now.

    Right now, all I have figured out is how to make up to 3 columns using ONLY css, but I want to be able to make 5 or 6 or even 7 would be best (this would oonly be in one row (like a header but used for several different things..7 things in fact).

    When I was using tables this was not an issue. To make a "unique" "picture" border around a box was done by adding extra columns around the box to color in the look.....now how do I accomplish this with ONLY css as they are wanting us to do now a days? Tabless is nice, and loads faster, but trying to get more then 3 columns is, well for lack of a better term, a challange.

    If someone could explain how to get several divs to line up across the screen and be cross browser (the latest version only is fine) compatible...th at would be great.

    Thanks for ANY help you can lend my way....very much appreciated.
  • drhowarddrfine
    Recognized Expert Expert
    • Sep 2006
    • 7434

    #2
    You mean like this?
    [HTML]
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title></title>
    <style type="text/css">
    html,body{
    height:100%;
    margin:0;
    }

    div {
    float:left;
    border: 5px solid green;
    width:100px;
    height:100%;
    }

    </style>
    </head>
    <body>

    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>

    </body>
    </html>
    [/HTML]

    Comment

    • adventurer
      New Member
      • May 2007
      • 3

      #3
      lMAO!

      Yea, just like that :). I knew I was overcomplicatin g it...lol. I keep thinking from a damn table perspective...g ot WAY to use to it. Thanks so much!

      Comment

      Working...