On Sat, 6 May 2006 18:46:20 +1200 KiwiBrian <br******@ihug.co.nz> wrote:
|
| "KiwiBrian" <br******@ihug.co.nz> wrote in message
| news:e3**********@lust.ihug.co.nz...
|>I have a text based and css controlled horizontal menu where on hover the
|>text and "button/cell" background colour change.
|> Fine so far, the background colour fills the button.
|> However if one of the menu buttons has two lines of text, while the hover
|> background colour does fill that menu button, the other buttons, which are
|> now in taller buttons, only have a strip of hover background colour which
|> does not extend to the top and bottom of the button.
|> Is there a way of dealing with this so that the hover colour fills the
|> button regardless of the height of the container?
|> Or some alternative method of achieving the same result.
|> I would expect that many have encountered this problem, but it is a first
|> for me.
|> Thanks for any help/ideas.
|> Brian Tozer
|
|
| Oops, here is my link control CSS
|
| .link1 A {
| font-family: arial;
| font-size: 13px;
| font-weight: bold;
| background-color: #310031;
| color: #F4DCA2;
| text-decoration: none;
| display: block;
| width: 100%;
| }
|
| .link1 A:hover {
| color: #000000;
| background-color: #CC9933;
| }
That's because the A element itself is not filling the box when the box is
forced larger because another button has 2 lines of text. Move the pointer
to the area above or below that strip that isn't being colored and you will
see that the color reverts back even though the pointer is still inside the
box you are making a button of.
You would have to apply these properties to the box itself. But since IE
does not support :hover for other than an A element (so I am told, and at
least for IE 6), it won't work right in IE unless a way can be found to do
a box using an A element. I tried that for another idea I was working on
a few days ago and it didn't work. But maybe your simpler case might.
What is the HTML element you're using to surround each button and what CSS
do you have for that?
--
-----------------------------------------------------------------------------
| Phil Howard KA9WGN |
http://linuxhomepage.com/ http://ham.org/ |
| (first name) at ipal.net |
http://phil.ipal.org/ http://ka9wgn.ham.org/ |
-----------------------------------------------------------------------------
