div out of line

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

toffee - 29 Dec 2006 01:29 GMT

Hi all,

I've got a problem which has doing my head in for couple of days now; i have
2 div's as follow:

#diva {float:left; width: 600px}

#divb {float: left; width: 220px}

then in the html:
<div>
<diva></div>
<divb></div>
</div>

So that diva and divb are next to each other in 1 line. This works on
resolutions 1024*768 or higher; but on 800*600 and lower; divb appears
underneath diva.

Is it possible that diva and divb are always next to each other; and if the
resolution is too low then create a horizontal scrollbar?

I hope i explained it clearly enough but let me know if in doubt.

Kind regards

T

Reply to this Message

boclair - 29 Dec 2006 04:08 GMT

>i have 2 div's as follow:
>
[quoted text clipped - 11 lines]
> resolutions 1024*768 or higher; but on 800*600 and lower; divb appears
> underneath diva.

600px + 220px > 800px.

See http://www.w3.org/TR/REC-CSS2/visuren.html#floats

"A left-floating box that has another left-floating box to its left may
not have its right outer edge to the right of its containing block's
right edge. (Loosely: a left float may not stick out at the right edge,
unless it is already as far to the left as possible.) An analogous rule
holds for right-floating elements."

> Is it possible that diva and divb are always next to each other; and if the
> resolution is too low then create a horizontal scrollbar?

If diva and divb must be of fixed width (as against in the equivalent
width ratio) place diva and divb in a containing div of width >= 820px

Louise

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / December 2006

div out of line