Jess Jacobs wrote:
> http://www.akisma.com/design/monks/
>
> in FF OSX, the black bars extend the full 100% (yay) but the "main"
> layer does not, making them hang awkwardly off the edge.
In accordance with CSS specs horizontal 'padding' gets 'added' to width
in standard compliant browsers, so...
'width: 100%;' = full width exactly,
...but...
'width: 100%;' + 'padding-left: 5px;' = full width + 5px.
Similarly your floating #aux is 28% + 30px wide.
> In addition, the darker (right side) column should be flush with both
> the 1st column (including the menu) and the rightmost edge, but it
> is not.
1: you're relying on fixed font-sizes to make #nav keep its dimensions
and stay in place. Doesn't work since there is no such thing as "fixed
font-sizes". Browsers always take over if end-users want.
This makes the #nav change in width and push the width of the
left-floating #main - depending on applied font-resizing.
2: since you want #aux flush right it is best to start there, by
declaring #aux {float: right;} instead of trying to push it right by
floating it next to the #main.
3: declaring a 'height' in percentages on #main doesn't work, so you can
delete that rule.
4: #main needs an exact 'width' to close the gap between it and #aux
without pushing #aux down.
#main {width: 568px;}
...will make it fit exactly in what's left when you calculate...
830px - (28% + 30px), which is 'width' of #wrapper minus 'width' of
#aux. However, not all browsers will add up percentages and pixels with
exactly the same result, so an additional 'pulled in backside margin' is
necessary for reliable line-up across browser-land without gaps.
#main {margin-right: -2px;}
...should do.
5: your #nav-list needs zeroing of both margins and paddings, since the
back and forth you have now doesn't work well across browser-land.
Browsers do have defaults margins and paddings on lists, and they are
not identical. Same with paragraphs, so the paragraph in "bottom bar"
may need zeroing out too.
In total, I think you want something like this...
HTML:
<http://www.gunlaug.no/tos/alien/jj/test_08_0904.html>
CSS: <http://www.gunlaug.no/tos/alien/jj/test_08_0904_files/global00.css>
regards
Georg
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
