|
|
Posted by Snef on 10/17/06 14:45
Ben C wrote:
> On 2006-10-17, Snef <s.franke@snefit.com> wrote:
>> Hi,
>>
>> I'm trying to do a simple thing but for some reason I do not get it right.
>>
>> I have 2 div's that are floating next to eachother. The most left div is 200px
>> in width. The div on the right is of unknown width (that depends on the left
>> div, that one can be hidden when there is no content in it).
>> In IE the right div is displayed next to the left one, but FF shows it onder the
>> first because it has no width set.
>>
>> How can this be solved?
>
> Set a width on the second div as well.
>
> Don't know what IE is up to but FF is showing correct behaviour here.
>
> Since the div's preferred width (width of its content with no line
> breaks) is greater than the containing width, the computed width is the
> containing width. The containing width is wider than the space left to
> the right of the first div, so the float moves down to find enough room.
>
>> Here is an example:
>>
>> <div style="width: 500px; background-color: #cccccc; overflow: auto;">
>> <div style="float: left; width: 200px; background-color: #eeeeee; display:
>> inline;">
>> div1
>> </div>
>> <div style="float: left; background-color: #dddddd; display: inline;">
>> div2 div2 div2 div2 div2 div2 div2 div2 div2 div2 div2 div2 div2 div2 div2
>> </div>
>> </div>
Ben,
Thank you for yor reply.
Your solution is just the problem... I do not know the width of the second div
(in the real world example).
The first div can also be hidden (display:none) and then I would like to stretch
the second div to maximum width. So this can not be done by CSS, i need to use
Javascript i think (I know how to do that!)???
Snef.
Navigation:
[Reply to this message]
|