|
Posted by nagasaki mike on 10/17/06 23:38
"nagasaki mike" <n@gasaki.com> wrote in message
news:tPadnVfogpxT-qjYnZ2dnUVZ8s-dnZ2d@eclipse.net.uk...
>
> "nagasaki mike" <n@gasaki.com> wrote in message
> news:dpCdnbUrvt8N-6jYnZ2dnUVZ8qGdnZ2d@eclipse.net.uk...
> >
> > "nagasaki mike" <n@gasaki.com> wrote in message
> > news:GYednch7Arjb-6jYRVnyig@eclipse.net.uk...
> > >
> > > "Snef" <s.franke@snefit.com> wrote in message
> > > news:29882$4534b8a6$3ec24187$8455@news.chello.nl...
> > > > 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>
> > >
> > > what is the enclosing div for? it is 500px wide so nothing is going to
> go
> > > wider than that.
> > > kill the enclosing div. oh and make your right div float:right. though
> > this
> > > div will only stretch as far as its content.
> > > and then
> > > <div style="float: left; width: 200px; background-color: #eeeeee;"
>this
> > > will disappear when empty</div>
> > > <div style="float: left; background-color: #dddddd;">
> > > this will only stretch as far as its content</div>
> > >
> > eek ignore the float right bit....
> >
> oh dear vodka. anyway if the right div fills up the leftover space with
more
> to spare it will then flow underneath the first div. so you could give the
> first div a very tall height thing. or give the second div (as said
> previously by better men than me) a left hand margin of 200 - and just
make
> sure the first div is never empty so it doesnt look funny. yikes. i'll get
> my coat.
>
right... last go. ignore the 'make the first div really tall' bit because
that doesnt work (in opera or firefox) when the right div contains more
content than the remaining width of your viewing area - it just goes under
the left div.
anyway. give right dive left hand margin of 200 and dont leave left hand div
empty. my coat is now on and i may be a while.
Navigation:
[Reply to this message]
|