Re: full height columns
- From: Ben C <spamspam@xxxxxxxxx>
- Date: Mon, 22 Oct 2007 10:18:39 -0500
On 2007-10-22, Jeff <dont_bug_me@xxxxxx> wrote:
Nearly identical post in alt.www.webmaster, where it is languishing.
I did see it but couldn't really understand what you were asking.
I'd like a column that flows the full height of a page, even if you
scroll down.
If I did this:
<div style="width: 100px;height=100%;background-color: red">
side bar
</div>
<div style="float: left; background-color: #fff">
main content, enough to have vertical scroll bars on the browser
</div>
This puts the main content after the sidebar, which is what I don't
get-- surely the sidebar is supposed to be at the side?
I'd have problems after I scrolled down with content wrapping around.
What do I need to do? Seems like I should know this, but... I'm
drawing a blank.
Probably put the sidebar inside a container that contains both it and
the main content. The container's height will grow to fit the content.
Then you just have to make the sidebar fill its container, which can be
done with absolute positioning (position: relative on the container,
position: absolute; top: 0; bottom: 0 on the sidebar).
Height: 100% of an auto-height container is no good-- it will be
ignored. But you can locate a positioned box to the top and bottom edges
of an auto-height container.
What's the support level of inline-block these days?
Supported in Opera, Konqueror/Safari. OKish in IE7 I heard so long as
you set widths on the inline-blocks. Completely and utterly broken in
Firefox.
.
- Follow-Ups:
- Re: full height columns
- From: Jeff
- Re: full height columns
- From: Jeff
- Re: full height columns
- References:
- full height columns
- From: Jeff
- full height columns
- Prev by Date: forcing SPAN elements together in a single row
- Next by Date: Re: forcing SPAN elements together in a single row
- Previous by thread: full height columns
- Next by thread: Re: full height columns
- Index(es):
Relevant Pages
|
