Forum Moderators: not2easy
I have a design with 3 columns in a fixed width layout.
A left column, content column and right column.
On some pages there will be no left column and the right column must scale automaticly to fill the free space.
Here is a example picture: (i read in the forum rules that urls are not accepted so i disabled it with "/". I hope this is ok)
<snip>
How is this to be done? If possible could you give a code example?
Kind regards,
Kurios
[edited by: swa66 at 10:17 am (utc) on Mar. 27, 2009]
[edit reason] "No personal URLs", means "No personal URLs" [/edit]
In the past, I've solved this with something like:
html:
<!DOCTYPE...>
<html>
...
<body class="hasextra">
<ul class="menu">
...
</ul>
<div class="extra">
...
</div>
<div class="content">
...
</div>
</body>
</html>
versus:
<!DOCTYPE...>
<html>
...
<body>
<ul class="menu">
...
</ul>
<div class="content">
...
</div>
</body>
</html>
in your CSS this gives you:
.extra {
...
}
.content {
/* render it wide, no 3rd column */
...
}
.hasextra .content {
/* render it narrow to allow for a third column */
/* only needs overrules from the above */
...
}
Thank you for your reply! I am not allowed to use classes on the body tag. Is there another way to accomplish this maybe?
