tmesa.mesadesignhouse wrote:
> In IE7 (I haven't checked IE6 yet), the navigation centers vertically
> perfectly. In FF (on PC and Mac) and Safari, the navigation is going
> to the top of the box that is a background image. I can't for the
> life of me figure out why.
IE6 and IE7 are cheating - the effect of 'hasLayout'[1], which means no
other browser - including IE8 - will follow their lead without some
proper styling.
To fix, add a "new box formatting context"[2] generating style, like...
div.list-menu {
float: left;
width: 100%;
}
...to keep the margin-top on div.list-menu ul from escaping
div.list-menu and join - "collapsing"[3] into - its margin-top.
I used that particular styling with 'float', to avoid problems with some
of the alternatives in even older IE/win versions.
> Then I need to put the donation box (in its own div) in the
> horizontal center of that 250px width of the nav box that wraps both
> the list- menu div and the donation div, not flush left. Have a
> feeling this may be a parent-child or ancestor thing that I can't
> figure out. I can't get that to work on any of the browsers I've
> checked today.
Not sure if I understand how you want that to appear visually, so here's
a partial and pretty rough example on how I would do it...
<http://www.gunlaug.no/tos/alien/tm/test_08_0328.html>
CSS:
<http://www.gunlaug.no/tos/alien/tm/test_08_0328_files/ierc0000.css>
Some cross-browser tuning still needed to make it appear the same
everywhere, I think, but the basic markup and CSS changes are there.
You need two - different - background-images for it to make it look
right. I just reused the single one you have in there, so the upper
corners show up for the lower one. You'll get the idea.
Note: make those background-images tall enough and allow the container
to stretch in height, to allow for some font-resizing. Fixed height
means it'll break under stress, so I've commented that height out for now.
> I was able to validate the CSS and HTML on this. :-) You guys have me
> trained.
Good - it helps :-)
> http://mdh-test.com/ieresidential/index.shtml
> http://mdh-test.com/ieresidential/ierc.css
regards
Georg
[1]http://www.satzansatz.de/cssd/onhavinglayout.html
[2]http://www.w3.org/TR/CSS21/visuren.html#block-formatting
[3]http://www.w3.org/TR/CSS21/box.html#collapsing-margins
--
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/
