|
|
Posted by dorayme on 10/18/06 00:05
In article <d4dd2$453549e8$3ec24187$3148@news.chello.nl>,
Snef <s.franke@snefit.com> wrote:
> >> <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!
You have a div left that is 200px wide. You need to give the
content to its right a margin to sit in. You do this (as jo jo
says) by a margin-left. Just don't make trouble and put in
anything like pics that are two big for the divs concerned (in
either div). Remember your example is of a couple of bits of
content within a mere 500, the left is 200 and the right is 300.
If you want a 200 to the left of a browser window with no
restriction of a wrapper, you can float a div to the left and
give the content div a margin of 200px and maybe a bit more or
less (for various reasons). You do not have to float this second
div. It will take up the rest of the space (divs being naturally
100% wide) unless you choose otherwise.
You seem to be conflating two situations. One of all going on in
a 500 div, the other in a browser window that can be resized.
--
dorayme
Navigation:
[Reply to this message]
|