Divs side by side

Bergamot wrote:

Jeff wrote:
Is Allan Flavell still around?

Sadly, he passed away about a year ago. He is sorely missed.

Oh, I am so sorry to hear that.

I can only say that I did not expect this sad news. What a nice guy
he was.

Cheers,
Jeff

dorayme wrote:

In article <13nmoir3mqtgm09 (AT) corp (DOT) supernews.com>,
Jeff <jeff (AT) spam_me_not (DOT) com> wrote:

BTW, if you write that link as:

URL:
http://netweaver.com.au/floatHouse/a...nshots5_1.html
/

You should get around the link wrap problem. YMMV.
Actually, thanks for that.
I think I got that from either Allan or Jukka... Is Allan Flavell
still around?

Latter is not I understand. Our loss.

A large loss. And a loss to all he touched, a really nice guy, even when
he did not have to be.

Jukka can't go because he

is not human, he is an institution.

Yes.

or

http://tinyurl.com/346wyf

and see the bottom of the page. There is no need here for
overflow anything
That makes sense to me.

But if it makes sense to you, and you can *see* the border in IE6
as in screenshot referenced above, then why are you talking about
"overflow: hidden" not working in IE6?

Hmmm, we seem to have gotten twisted around.

If you just use overflow: hidden, it does not work in IE6 and you
cannot see the border

But, Jeff, my point is why would you use overflow in IE for
showing the border of a container in the situation we are
discussing since the problem does not show up in IE6 in the first
place

Actually, what I'm saying is that I get no border in IE6.0.2900 XP SP2
with this snipit:

<div style="border: 1px solid red;">
<div style="float: left">xxxx</div>
<div style="float: left">yyyy</div>
</div>

And adding overflow: hidden does not help.

Adding a clearing div does.

Jeff



(As can be seen from an actual screenshot at the bottom of

URL:http://tinyurl.com/346wyf />? Are you saying that if you do
use overflow, then what was not even a problem in IE suddenly
becomes a problem? Now that would be interesting to me.

Here is a test, would you kindly do me a favour, I cannot at the
moment look at Windows IE, go to

URL: http://netweaver.com.au/floatHouse/page8.html /

and tell me if you are not seeing the border on Figs 2, 3 and 4
in Win IE? There may well be an issue I am not aware of. (There
are several jigsaw pieces missing still from my Theory of
Everything <g>)

In article <13noq5qninhuj04 (AT) corp (DOT) supernews.com>,
Jeff <jeff (AT) spam_me_not (DOT) com> wrote:

But, Jeff, my point is why would you use overflow in IE for
showing the border of a container in the situation we are
discussing since the problem does not show up in IE6 in the first
place


Actually, what I'm saying is that I get no border in IE6.0.2900 XP SP2
with this snipit:

div style="border: 1px solid red;"
div style="float: left">xxxx</div
div style="float: left">yyyy</div
/div

Are you seeing borders at:

<URL: http://netweaver.com.au/floatHouse/a...s/page5_2.html
/>

when viewed in IE6?

--
dorayme

Jeff wrote:

Sorry, I was talking with my brother and did not see the rest of
your post.


<snip>

If you just use overflow: hidden, it does not work in IE6 and you
cannot see the border

But, Jeff, my point is why would you use overflow in IE for showing
the border of a container in the situation we are discussing since the
problem does not show up in IE6 in the first place


Actually, what I'm saying is that I get no border in IE6.0.2900 XP SP2
with this snipit:

div style="border: 1px solid red;"
div style="float: left">xxxx</div
div style="float: left">yyyy</div
/div

And adding overflow: hidden does not help.

Adding a clearing div does.

Jeff



(As can be seen from an actual screenshot at the bottom of
URL:http://tinyurl.com/346wyf />? Are you saying that if you do use
overflow, then what was not even a problem in IE suddenly becomes a
problem? Now that would be interesting to me.

Here is a test, would you kindly do me a favour, I cannot at the
moment look at Windows IE, go to
URL: http://netweaver.com.au/floatHouse/page8.html /

and tell me if you are not seeing the border on Figs 2, 3 and 4 in Win
IE?

I see borders on everything.

There may well be an issue I am not aware of.

Our examples are different.

Jeff


(There are several

jigsaw pieces missing still from my Theory of Everything <g>)

In article <13nos9tsk8fc880 (AT) corp (DOT) supernews.com>,
Jeff <jeff (AT) spam_me_not (DOT) com> wrote:

(As can be seen from an actual screenshot at the bottom of
URL:http://tinyurl.com/346wyf />? Are you saying that if you do use
overflow, then what was not even a problem in IE suddenly becomes a
problem? Now that would be interesting to me.

Here is a test, would you kindly do me a favour, I cannot at the
moment look at Windows IE, go to
URL: http://netweaver.com.au/floatHouse/page8.html /

and tell me if you are not seeing the border on Figs 2, 3 and 4 in Win
IE?

I see borders on everything.

There may well be an issue I am not aware of.

Our examples are different.

Jeff

Anyway, you have got me worried enough to look at some things
again on IE6 when I can. What I will be keen to know is id the
'overflow: hidden/auto solution' to making a container grow
height for floated children in non-IE browsers somehow disrupts
IE6 or even 7. Cheers.

--
dorayme

Jeff wrote:

Actually, what I'm saying is that I get no border in IE6.0.2900 XP SP2
with this snipit:

div style="border: 1px solid red;"
div style="float: left">xxxx</div
div style="float: left">yyyy</div
/div

And adding overflow: hidden does not help.

To get the desired behavior in IE, you can add zoom:1;
It's a proprietary property that doesn't do any harm to other browsers,
but can resolve a slew of issues related to IE's weird "hasLayout" mode.
google for more info on that subject.

The zoom property can help both IE6 and IE7 when other methods fail.

--
Berg

Bergamot wrote:

Jeff wrote:
Actually, what I'm saying is that I get no border in IE6.0.2900 XP SP2
with this snipit:

div style="border: 1px solid red;"
div style="float: left">xxxx</div
div style="float: left">yyyy</div
/div

And adding overflow: hidden does not help.

To get the desired behavior in IE, you can add zoom:1;
It's a proprietary property that doesn't do any harm to other browsers,
but can resolve a slew of issues related to IE's weird "hasLayout" mode.
google for more info on that subject.

The zoom property can help both IE6 and IE7 when other methods fail.

I've never hear of that.

I found this:

<URL: http://www.satzansatz.de/cssd/onhavinglayout.html />

But I'm not sure I have enough sanity to get through it. Can you
elaborate on this, or provide another reference?

So. Can I just do this:

div {zoom: 1;}

And since I never use overflow, although I think I will now. Does it
have any other effect if you do not specify a height?

Jeff

Jeff wrote:

URL: http://www.satzansatz.de/cssd/onhavinglayout.html /

But I'm not sure I have enough sanity to get through it. Can you
elaborate on this, or provide another reference?

I've never actually read all the gory details about hasLayout, I just
know it exists and affects how IE handles various positioning methods.

So. Can I just do this:

div {zoom: 1;}

On the container holding the floats, yes. It probably won't have much
effect if used on the floats themselves, but I guess it depends on
what's in them. BTW, adding position:relative can have some positive
effects in IE, as well, but don't use it unless you need to.

And since I never use overflow, although I think I will now.

Put that on the float container, too, so better browsers do what you want

..container {overflow:hidden; zoom:1}

Be aware that since the zoom property is proprietary, validating the CSS
will result in an error. I just ignore that error, myself. Those who are
sticklers about it insist on putting these things in conditional
comments. That just pollutes and bloats the HTML instead of the CSS,
IMO. Do as you see fit in that regard.

Does it
have any other effect if you do not specify a height?

I don't know, but maybe they mention it here:
http://www.quirksmode.org/css/clearing.html

--
Berg

In article <5u48ruF1gelqpU1 (AT) mid (DOT) individual.net>,
Bergamot <bergamot (AT) visi (DOT) com> wrote:

Jeff wrote:

Actually, what I'm saying is that I get no border in IE6.0.2900 XP SP2
with this snipit:

div style="border: 1px solid red;"
div style="float: left">xxxx</div
div style="float: left">yyyy</div
/div

And adding overflow: hidden does not help.

To get the desired behavior in IE, you can add zoom:1;
It's a proprietary property that doesn't do any harm to other browsers,
but can resolve a slew of issues related to IE's weird "hasLayout" mode.
google for more info on that subject.

The zoom property can help both IE6 and IE7 when other methods fail.

If you give a width to the container, any width at all, you will
then cause IE6 to grow height to house floated children. That was
the big difference between Jeff's example here and the ones I was
discussing and referring Jeff to at <URL:
http://netweaver.com.au/floatHouse />. In the main I was using,
in effect, parent containers like:

<div style="border: 1px solid red; width: 500px;">

But you can use width="100%" if you want and it will cause IE to
grow its height. Perhaps this is something to do with tripping
that hasLayOut thing.

I finally got to a winbox this morning to see what it was that
Jeff and I were not quite on the same wavelength about. Actually,
Jeff, thanks for this as I might add a little something about it.
I might even mention this zoom thing too.

No need for proprietory IE for the purpose of getting parents to
grow height. Maybe there is a need for other purposes?

--
dorayme

dorayme wrote:

In article <5u48ruF1gelqpU1 (AT) mid (DOT) individual.net>,
Bergamot <bergamot (AT) visi (DOT) com> wrote:

Jeff wrote:
Actually, what I'm saying is that I get no border in IE6.0.2900 XP SP2
with this snipit:

div style="border: 1px solid red;"
div style="float: left">xxxx</div
div style="float: left">yyyy</div
/div

And adding overflow: hidden does not help.
To get the desired behavior in IE, you can add zoom:1;
It's a proprietary property that doesn't do any harm to other browsers,
but can resolve a slew of issues related to IE's weird "hasLayout" mode.
google for more info on that subject.

The zoom property can help both IE6 and IE7 when other methods fail.

If you give a width to the container, any width at all, you will
then cause IE6 to grow height to house floated children. That was
the big difference between Jeff's example here and the ones I was
discussing and referring Jeff to at <URL:
http://netweaver.com.au/floatHouse />. In the main I was using,
in effect, parent containers like:

div style="border: 1px solid red; width: 500px;"

Hmmm, in practice I would have added a width! Unless you have nested
divs, shades of nested tables... a width is usually needed.

But you can use width="100%" if you want and it will cause IE to
grow its height. Perhaps this is something to do with tripping
that hasLayOut thing.

I don't think anybody knows what IE does!

I finally got to a winbox this morning to see what it was that
Jeff and I were not quite on the same wavelength about. Actually,
Jeff, thanks for this as I might add a little something about it.
I might even mention this zoom thing too.

Well, we are all in this html thing together.

No need for proprietory IE for the purpose of getting parents to
grow height. Maybe there is a need for other purposes?

OK. I don't see where it does any harm and it may fix some other quirk.
I don't care if a page triggers a validate error, as long as I know why.
Until recently I worked for someone whose html you wouldn't have wanted
to wade through, ah the things I've done for a half a living!

Oh, and a fasolatee to you!

Jeff