Stylesheets - How do I stop the "flow"

Author

How do I stop the "flow"

meltedown

2005-11-18, 3:27 am

I run into this problem over and over and over again and its driving me
crazy.

This has a menu on the floated menu on the left.
The part to the left of that menu has a margin-left

It look fine in firefox, but when the window is small in IE, the stuff
on the right flows down and it looks UGLY.

How do I get it to NOT flow in ie.
Should I just use a table ?

I don't neccesarily want to use a float for something like this, but I
would much rather use divs than a table. But I can't figure out how to
do it.

meltedown

2005-11-18, 3:27 am

I'm such an idiot.
https://newglobalsoaps.com/catalog/index.php?pline=7857
meltedown wrote:
>
> I run into this problem over and over and over again and its driving me
> crazy.
>
> This has a menu on the floated menu on the left.
> The part to the left of that menu has a margin-left
>
> It look fine in firefox, but when the window is small in IE, the stuff
> on the right flows down and it looks UGLY.
>
> How do I get it to NOT flow in ie.
> Should I just use a table ?
>
> I don't neccesarily want to use a float for something like this, but I
> would much rather use divs than a table. But I can't figure out how to
> do it.

meltedown

2005-11-18, 6:38 am

meltedown wrote:
> I'm such an idiot.
> https://newglobalsoaps.com/catalog/index.php?pline=7857
> meltedown wrote:

I think I improved it. Now everything is floated. It still flows, but
its not so ugly. When it was flowing down, but to the right of the menu
and not directly below it, that was ugly. Now it flows down and to the
left.[color=darkred]

2005-11-19, 10:23 pm

When I tested it in firefox, it also flows, i.e. when the window is too
small items 'jump' down to the open space.

Maybe someone else will have a better method, but I'd suggest
absolutely positioning items, e.g. the main content on the right hand
side, instead of floating it. In this case, when the page resizes, the
content won't move, but it will get cut-off.

Gus Richter

2005-11-19, 10:23 pm

yb wrote:
> When I tested it in firefox, it also flows, i.e. when the window is too
> small items 'jump' down to the open space.
>
> Maybe someone else will have a better method, but I'd suggest
> absolutely positioning items, e.g. the main content on the right hand
> side, instead of floating it. In this case, when the page resizes, the
> content won't move, but it will get cut-off.
>

Your proposed method will cause the overflow to create a horizontal
scrollbar on window size reduction.

The situation here is that the items are defined with a fixed width. If
a _fluid layout_ is desired, a percentage width should be used instead.
If the window width is reduced, the width will adjust and stay in position.

--
Gus

meltedown

2005-11-21, 6:55 pm

Gus Richter wrote:
> yb wrote:
>
>
> Your proposed method will cause the overflow to create a horizontal
> scrollbar on window size reduction.
>
> The situation here is that the items are defined with a fixed width. If
> a _fluid layout_ is desired, a percentage width should be used instead.
> If the window width is reduced, the width will adjust and stay in position.
>
Ok, thanks for that suggestion, I changed it so the widths are
percentages, and it flows much better.
https://newglobalsoaps.com/catalog/...d=96&pline=7857

I might try the absolute postioning thing just to see what it looks
like, and it might even look better without all that squishing going on,
but I kind of like the way it looks now. The squishing factor is helped
greatly by min-widths, but as you know,that doesn't effect IE6

Everything is still floated left, but it hardely ever drops down because
the widths just gets smaller and smaller. So to answer my own question
from earlier, one way to get side by side dives without ugly drop down
flowing is to float them (which makes them sit side by side) and to use
percentage widths (which makes them get smaller instead of dropping
down, at least untill the screen gets real small, which is fine). At
that point I take what I can get.

So at this point I feel like maybe, just maybe, I'm getting the hang of
CSS layout. This is where you guys come in and tell me its all wrong.

I tried to put it through the validators, but they don't seem to think
the page exists, probably because its https (behind a certificate)