|
|
Posted by Snef on 10/18/06 05:47
nagasaki mike wrote:
> "Snef" <s.franke@snefit.com> wrote in message
> news:d4dd2$453549e8$3ec24187$3148@news.chello.nl...
>>
>> jojo wrote:
>>> Snef 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?
>>>>
>>>> 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>
>>> Simply set a margin-left:200px; to your right <div>. Should work. If you
>>> have a border applied to your <div>s add the border-width to the margin.
>>> If you are not sure about howmuch to add just set margin-left: 210px;,
>>> this should be enough.
>> No, not what I meant.
>>
>> The second div should fill the available space leftover. The first div can
> be
>> hidden when empty: div 2 is placed to the left and fills the whole space!
>
> why would the first div be empty?
>
>
The first div can be empty in my situation. The content (news items) are loaded
through ajax and the div is [display:hidden] when no content is available.
Never mind, i already have a ajax/js solution i was just searchin a way to solve
it in pure css only ;)
Thnx.
Navigation:
[Reply to this message]
|