CSS Help>/ this sounds simple but is it?...... where's Eric M

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Silky
    #1

    CSS Help>/ this sounds simple but is it?...... where's Eric M

    Iam trying to get the green footer div to sit on the bottom of all
    three divs so as the divs vary in height it sits off the bottom of the
    lowest one

    I cannot use absolutes because the three colum are dynamically driven
    maybe Iam missing something really simple?

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://wwww3.org/TR/xhtml1-transitional.dt d">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <html>
    <head>
    <title></title>
    <style type="text/css">
    #bigcontainer {
    margin: 0px auto;
    width: 768px;
    position: relative;
    border: thin solid Fuchsia;
    }
    #left{
    width: 164px;
    position: absolute;
    border: thin solid #00008B;
    }
    #middle{
    left: 169px;
    width: 430px;
    position: absolute;
    border: thin solid Red;
    }
    #right{
    left: 604px;
    width: 164px;
    position: absolute;
    border: thin solid #00008B;
    }
    #footer{
    margin: 0px auto;
    clear: both;
    width: 768px;
    position: relative;
    border: thin solid #32CD32;
    }
    </style>
    </head>

    <body>
    <div id="bigcontaine r">
    <div id="left"><img src="/" width="164" height="250" alt=""
    border="0"></div>
    <div id="middle"><im g src="/" width="430" height="200" alt=""
    border="0"></div>
    <div id="right"><im g src="/" width="164" height="250" alt=""
    border="0"></div>
    <div id="footer">&nb sp;</div>
    </div>

    </body>
    </html>
    Tags: None
    • Matthias Gutfeldt
      #2
      Re: CSS Help&gt;/ this sounds simple but is it?...... where's Eric M

      Silky wrote:[color=blue]
      > Iam trying to get the green footer div to sit on the bottom of all
      > three divs so as the divs vary in height it sits off the bottom of the
      > lowest one
      >
      > I cannot use absolutes because the three colum are dynamically driven
      > maybe Iam missing something really simple?[/color]

      Absolute positioning takes the element out of the normal flow. That's at
      the root of your problem here.

      But instead of re-inventing the wheel, work with one of the gazillions
      of already existing three-column-with-footer layouts, e.g. this one
      here: <http://www.positionise verything.net/thr.col.stretch .html>


      Matthias

        Comment

        Previous template Next
        Working...