-----Original Message-----
From: Gunlaug Sørtun [mailto:[EMAIL PROTECTED] 

#topmenu {
background: #b51b37 url(images/topbarback.jpg) repeat-x bottom left;
margin: 0 /* default */;
float: left /* make it expand to contain floats */;
width: 100% /* full width */;
}

--
OK, That worked...
--

> 2. The top menu's mouseover does not work.

The background-image is covering the background-color, so you can't see any
hover-effect. You'll have to change, or modify, the background-image too, or
set the background-color as the only background.

#menu a:hover {background: #b51b37;}
...will do the latter.

--
The #menu mouseovers work with #menu a:hover {background-color:
#b51b37;background-image: none;} but the #topmenu mouseovers do not work and
they are practically identical #topmenu a:hover, #topmenu a:active;
{background-color: #b51b37;background-image: none;}. So, I don't know if
this is the fix. I removed the background: from the #topmenu a styles and
added it to the #topmenu style so that it would be laid down and then when
the anchor tags are on top of it the mouseovers should give the anchor tags
the background color since they are on top of the main DIV background but
that didn't help.
--

The header-image is an inline-element by default, placed on the baseline
with room/space for descenders. The 2px gap is what you get at a certain
font-size, and it will change when font-resizing is applied.

Add...
#header img {display: block;}
...and the space will be gone.
You can then delete the 'margin-top: -2px;' on #topmenu a, #topmenu a:link,
#topmenu a:visited.

--
That worked, too...
--

The use of 'target="_blank"' is not valid Strict.

--
I knew that and thought I stripped them all out...
--

I see that you are using 'pixels' for font-sizing. No problem for me but you
can not rely on font-size being respected in browsers. You should test
across browser-land and make sure the layout doesn't break when some serious
amounts of font-resizing is applied.

--
I know this is an issue but I haven't gotten the hang of font-resizing yet.
I know I'm too old school but I have an idea in mind and I make the site
look like I want. If it looks bad when someone screws with it then I'm kinda
lost as to what to do. If I make a ton of nice graphics and buttons and
someone scales the type there's no way to make it look good. Like if I have
a nice 100px x 50px graphic with bevelled edges and shadows as a button
background and the type is scaled up or down then all the hard work I put
into that graphic is wasted as the image will either be cropped by smaller
type or there will be big gaps around the edges (or the image will get
tiled) if larger type is used. I know from reading a couple books that there
are ways to make the images elastic as well but I'm not up to the task yet.
I'm lucky to get what I have so far...
--

The page-container doesn't expand in the good browsers - because you haven't
"told them to". That's normal response when 'floats' are used, but I guess
you want a complete background down the whole page.

Adding either...
#page {overflow: hidden;}
...or...
#page {display: table;}
...will make them "get the idea" and make #page expand to contain everything
inside.

--
I'm not sure where the problem is here. I've only defined a width for #page
so it has to expand in length to accommodate my content, of which there is
nothing yet. Right?

Thanks for the help...

Mike


______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to