Derek,

On Jan 28, 2006, at 11:41 AM, Tunnel 7 wrote:

> Hello.
>
> This is my first tableless layout and I have one bug that I just can't
> figure out.  When you hover over the body links the footer "jumps" - it
> looks like about 10 pixels of padding are added.  It can best be seen  
> on
> this page (mouse over body link then mouseover logo at top (it will  
> jump
> back):
>
> http://www.blueowlmassage.com/dev/clients_forms.php
>
> For a link hover I have defined a dotted 2px border - if I change it to
> just a text underline the "jump" will go away.

In what browser(s) are you seeing the jump.  I didn't see it in firefox  
1.5 on my mac.

There are 3 validation errors in the html, one of which is in the  
doctype.  You will want to fix those to get more consistent behavior  
across browsers.   
<http://validator.w3.org/check?verbose=1&uri=http:// 
www.blueowlmassage.com/dev/clients_forms.php>

There is an error in the css that is causing firefox to ignore one of  
your hover rules.

There is an error in the css which is causing firefox to ignore a bit  
of it.  You need to remove the extra comma.
#head a:hover, {
        text-decoration:none;
        border: 0;
}

In general, if you use a border on hover it is best to set it so it  
doesn't take up more space hovered than not.  Something like,

a { padding-bottom: 2px; }
a:hover {
        padding-bottom: 0;
        border-bottom: 2px dotted #ffe7be;
}

hth
-- 
Roger Roelofs
"Remember, if you’re headed in the wrong direction,
        God allows U-turns!"
          ~Allison Gappa Bottke
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to