Hello,

Could someone tell me what I'm doing wrong with my style sheet that
makes the main container DIV not stretch all the way to the bottom,
even though there's a DIV inside it that has plenty of content? Please
take a look:

http://www.house.gov/velazquez/lh020...tatements.html

This is my first website using CSS (not yet launched) so if you have
any other tips for making my CSS tighter or more efficient, I'd be
happy to hear them.

Thanks!

Luis

On 2007-02-28, hestres <luis.hestres@mail.house.govwrote:

Hello,
>
Could someone tell me what I'm doing wrong with my style sheet that
makes the main container DIV not stretch all the way to the bottom,
even though there's a DIV inside it that has plenty of content? Please
take a look:
>
http://www.house.gov/velazquez/lh020...tatements.html

It looks like the div inside it is a float. Floats do overflow their
containers, unless their containers are block formatting context roots.

See

http://groups.google.co.uk/group/com...622d5c5?hl=en&

Solutions: make the container a BFC root (float it left for example, but
watch out for sideffects). Or put something after the float, inside the
container, with clear: right set on it.

The container DIV only grows in vertical size with the
content it encloses. You have other DIVs inside the
container which also size themselves according to content.

But the container DIV does not care how large the contained
DIV's are unless there is some content following the
contained DIVS. The contained DIV's are responsible for
there own sizing.

2 possible solutions:

1) set the height or min-height attribute of the container
element (note - min-height does not work in IE6)

2)add some content after the last contained DIV so the
container has to figure out how large the contained DIVs are.

for example, just before the closing </divtag insert the
following:

<br style="clear:both" />
&nbsp; <-- this is a non break space -->

One last tip - to see the container DIV, add a temp border
attribute like this ...

<div id="container" style="border:thin dotted blue">

and you will see where the DIV is.

You will discover that a DIV that contains nothing but other
DIV will appear like a one dimensional container; width but
no height. Add some text after the last contained DIV to
'force' it to calculate its new height.

Cheers
Jim

On 2007-02-28, Diogenes <nospam@nospam.netwrote:

The container DIV only grows in vertical size with the
content it encloses. You have other DIVs inside the
container which also size themselves according to content.
>
But the container DIV does not care how large the contained
DIV's are unless there is some content following the
contained DIVS.

But the contained divs are themselves content. Just to clarify: a div
with auto height will be whatever height it needs to be fit to its
"normal-flow descendents" in. It doesn't matter how deeply nested those
descendents are.

What are "normal-flow descendents"? Anything that's not floated, or
position: absolute or position: fixed. In this case the box that
protruded from the bottom of the container div did so because it was
floated.

There is an exception where an auto height box will grow to fit its
floated descendents, and that's if it's a block formatting context root.
See my earlier post.

The contained DIV's are responsible for
there own sizing.
>
2 possible solutions:
>
1) set the height or min-height attribute of the container
element (note - min-height does not work in IE6)
>
2)add some content after the last contained DIV so the
container has to figure out how large the contained DIVs are.

The key things here are that that final box must be normal-flow and have
clear set on it, to require the container to grow vertically and to make
it clear the float respectively.

But yes this is probably the best solution. Sometimes it is encouraging
to see people fuss about not wanting to pollute their semantic soup with
elements whose sole purpose is to tweak the formatting. In that case
either your first solution is good, or if an auto-height is required,
then the container can be made a BFC root by changing its float,
overflow or display properties.

for example, just before the closing </divtag insert the
following:
>
><br style="clear:both" />
&nbsp; <-- this is a non break space -->

There should be no need for the &nbsp; unless it's needed to kick IE
into doing the right thing.

Good reply Ben. I posted this before I had a chance to read
your first response. I learned some new terminology.

Ben C wrote:

>
>
There should be no need for the &nbsp; unless it's needed to kick IE
into doing the right thing.

You're probably right here. In actual practice, instead of
putting an '&nbsp;' at the end, I usually write something
like 'Hey' so I can see it. The &nbsp; is useful if you want
some see space between the bottom border of the BFC root and
the border of the contained (and floated) DIVs

Cheers
Jim

On 2007-02-28, Diogenes <nospam@nospam.netwrote:
[...]

Ben C wrote:

>
You're probably right here. In actual practice, instead of
putting an '&nbsp;' at the end, I usually write something
like 'Hey' so I can see it. The &nbsp; is useful if you want
some see space between the bottom border of the BFC root and
the border of the contained (and floated) DIVs

I suppose so, but you could instead put a bottom margin on the float, or
bottom padding on the container.

&nbsp; just doesn't look cool.

Ben C wrote:

[...]

>
&nbsp; just doesn't look cool.

After reading your post I thought, "He's right. it is
uncool. I shall banish this practise forever" :-)

Then within an hour or, as I was struggling to get some
javascript working in IE7 (works fine in FF), I discovered
why I had this idea implanted in my brain.

You were right again! On your previous post, that is.

Have a look at this HTML page, uncomment line 190, and have
a look again.

http://68.147.197.6/calgarydj/uncool_IE7.html

BTW, the 2nd Sunday in March is the new Daylight Savings
Time switchover day.

A buddy of mine works for a cable provider with a panapoly
of Solaris, Linux and Windows servers.

Solaris required 3 patches, each of which required bringing
down the servers, applying the patch, and bringing them back
up again. That caused issues with the Oracle servers.

The Windows 2000 servers are no longer supported, M$ say
upgrade the your systems ($4000 a pop).

On the Linux servers, they applied a patch to some TZ_DATA
thingy and voila, it was a done deal.

Cheers
Jim

On 2007-03-01, Diogenes <nospam@nospam.netwrote:

Ben C wrote:

>
After reading your post I thought, "He's right. it is
uncool. I shall banish this practise forever" :-)
>
Then within an hour or, as I was struggling to get some
javascript working in IE7 (works fine in FF), I discovered
why I had this idea implanted in my brain.

Of course M$, the source of many uncool ideas.

You were right again! On your previous post, that is.
>
Have a look at this HTML page, uncomment line 190, and have
a look again.
>
http://68.147.197.6/calgarydj/uncool_IE7.html

You mean line 180?

BTW, the 2nd Sunday in March is the new Daylight Savings
Time switchover day.

xephem 3.6.1 is telling me 25th March, that's the 3rd Sunday. Are they
moving it then from this year onwards?

It's global warming gone mad.

Ben C wrote:
[snip...]

You mean line 180?
>

It's kind of a moving target right now. Last time I looked
it was 183.

>
xephem 3.6.1 is telling me 25th March, that's the 3rd Sunday. Are they
moving it then from this year onwards?
>
It's global warming gone mad.

Now would be a good time to tell us about xephem 3.6.1

I have to put things in context. I'm in Canada, which means
we fall in the shadow of the U.S.

George Bush had this idea (actually, IMHO, it was probably
someone else who though of this;, I don't think he's really
concerned or capable of understanding).

The transition date used to be the LAST Sunday in March and
October.

Now (or real soon now) Daylight Savings will be lengthened
by 4 weeks; 2 on the front, 2 on the tail.

I'm moving to the Netherlands soon! Should I be taking my
inflatable rafts with me? ;-)

Cheers
Jim

On 2007-03-01, Diogenes <nospam@nospam.netwrote:

Ben C wrote:

[...]

>
Now would be a good time to tell us about xephem 3.6.1

http://www.clearskyinstitute.com/xephem/

[...]

The transition date used to be the LAST Sunday in March and
October.
>
Now (or real soon now) Daylight Savings will be lengthened
by 4 weeks; 2 on the front, 2 on the tail.

Thanks for the info. I will watch out for any strangeness.

I'm moving to the Netherlands soon! Should I be taking my
inflatable rafts with me? ;-)

If anyone's up to the job of dealing with a few more metres of sea level
it's the Dutch, who have been managing the sea for centuries.

But we are straying off topic.

In comp.infosystems.www.authoring.stylesheets message <WzGFh.1192007$R63
..887264@pd7urf1no>, Thu, 1 Mar 2007 20:20:06, Diogenes
<nospam@nospam.netposted:

>
>The transition date used to be the LAST Sunday in March and October.
>
>Now (or real soon now) Daylight Savings will be lengthened by 4 weeks;
>2 on the front, 2 on the tail.

Three or four on the front, depending on year; always one on the tail.
Summer Time there will always be 34 weeks.

--
(c) John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v6.05 IE 6.
Web <URL:http://www.merlyn.demon.co.uk/- w. FAQish topics, links, acronyms
PAS EXE etc : <URL:http://www.merlyn.demon.co.uk/programs/- see 00index.htm
Dates - miscdate.htm moredate.htm js-dates.htm pas-time.htm critdate.htm etc.