Posted by Beauregard T. Shagnasty on 07/12/06 19:52

Water Cooler v2 wrote:

> OK, I tried the solution with frames. And it worked.

...but has all the 'evilness' of frames. ;-)

> Now, I am trying it with CSS and here's the CSS I use to embed the
> sidebar. Please have a look at this:
>
> DIV.sidebar
> {
> font-family: Georgia;
> /* font-size: 9pt; */ <-- points are for printing
font-size: 100%; <-- your visitors' default size
> background-color:pink;
> margin-top:0px;
width: 12em; <-- need to specify a width
10 to 12 should suffice depending
upon the width of your words
> }
>
> DIV.contentPane
> {
> /* margin-left:200px;
> margin-top: 0;
> margin-bottom:0;
> margin-right: 50px; */
margin: 0 0 5em 13em;
> }
>
> Yet, the side bar takes up the entire width of the browser.
>
> If I set the width of the side bar like so:
>
> width:200px;
>
> The side bar squeezes to 200 pixels but the rest of the space to the
> right remains empty and the contentPane still starts below the end of
> the sidebar, althought at a proper left-alignment of 200 px.

If the contentpane were, say, margin-left: 210px it probably would have
worked. However, the trouble with pixel-specific layouts is that when
your visitor increases her text size (due to your 9pt microfont), all
the text escapes the box.

See this site of mine. Note the CSS ids for #crmenu and #boxcontent
Note also how my style sheet does not use: DIV.crmenu ...

http://countryrode.com/

--
-bts
-Warning: I brake for lawn deer

[Back to original message]