Guys,
Don't know if your remember this or not, but back some time ago I emailed about
a three-column layout that was killing me. A helpful soul suggested using
"display:table-cell" to fix my problem, and it did!...except, not really in IE.
So, I finally relented. I gave up. I admitted defeat. I cried for awhile. Then,
I picked myself up...looking forward to the certain simplicity a two column
layout was sure to bring. I mean, three is hard...but two? Come on...we should
all be able to do THAT in our sleep.
Wrong...wrong for me anyway. I must be css-layout challenged.
So, I have essentially five key divs, that go like this:
<div id="outer_wrapper">
<div id="header"></div>
<div id="navigation"></div>
<div id="content"</div>
<div id="footer"</div>
</div>
I've been through various incarnations of css layout so far...the latest is
here:
#header {
padding:0px;
margin:0px;
width:80%;
clear:both;
}
#navigation {
width:20%;
float:left;
margin-right:5%;
}
#content {
float:right;
width:75%;
}
#footer {
text-align: left;
clear: both;
}
As you can see, pretty simple. And it works well....that is, until the window
shrinks so that there's not enough space to display both divs. Then, the
ugliness begins. In firefox, it's less ugly but still ugly...the content div
overlays the navigation div. Not the behavior I want. In IE, it's even
nastier...the content div simply drops below the navigation div...you can't
even see it anymore unless you scroll WAY down. What I wish would happen is
that scroll bars are display in the browser window...and that the divs would
shrink just to the point that they almost touch but don't overlap.
I've tried various ways to fix this...and it appears giving outer_wrapper a
width works in Firefox. But, it doesn't in IE.
I'm so defeated....I need help.
Would anyone care to login to my app and take a look? Here's the info:
http://www.foloup.com
username: css
password: mobydick
I would really, really appreciate any guidance you can provide.
Thank you!
John
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
