In article
<fe78fcea-b757-4874-a53b->,
vunet <> wrote:
> I want to position 2 divs correctly. First one is the content and
> second one is the right side bar of fixed size.
> I want the content to have no fixed width but right side bar would be
> 200px. If no right side bar div tag shown, the first div would fully
> expand.
I assume the difficulty you are having is that you are not wanting to
specify a right margin for the content div. In a table, in theory, it is
easy, you just have a 2 col table, give it a width of 100% and give the
2nd col a width of 200px.
<style type="text/css" media="screen">
body {margin: 0;}
table {border-collapse: collapse; width: 100%;}
td {color: #000; background: red;}
td#two {color: #000; background: silver; width: 200px;}
</style>
</head>
<body>
<table>
<tr><td>Content</td>
<td id="two">Right side</td></tr>
</table>
Now if there is no second table cell, the first will simply go the whole
width, notwithstanding the provision for a second in the CSS.
Of course, it is easy to achieve a 200px right side-bar with a right
float and a content that fills the left to the left by simply floating
the 200px wide div to the right and not floating the content div at all
(you are unlikely to want it to shrink to fit its own content, it might
never make it to the left edge of the right div!). Unfortunately, one of
the best ways to achieve this is to give the content div a right margin
in which the right div float sits:
<style type="text/css">
body {margin: 0;}
div#one {margin-right:200px;color:#000;background: red;}
div#two {float: right;width:200px;color:#000;background:silver}
</style>
</head>
<body>
<div id="two">Left side</div>
<div id="one">Content</div>
</body>
But you are unlikely to want this for the situation where there is no
right side panel. If you leave it as above but have no div#two, the
content div will still keep the margin.
Not sure why you would not simply adjust the CSS and margin etc to suit
the page and solve the problem, but I guess you have your reason, a
dynamic website, content management site?
There are other things to be tried but I will stop here.
--
dorayme
Similar Threads
