Pixel shift on hover

Posted on 2007-10-07
Last Modified: 2012-06-27

This problem is occuring in two separate areas of my page in IE6 only.
But to keep things simple, I've just made a test page up with one of them.
When you roll over the links the whole thing shifts, and then when you roll over the button it shifts back again.

I guess this is something to do with IE not liking hovers and zoom:1, but I have put that in a separate IEFixes.css file.  No luck though.  Not sure if it's relevant but I also have a hover behaviour attached to the body class.

Please help!  
Question by:Lady_M
    LVL 28

    Accepted Solution

    Strangely enough, deleting "cursor:hand;"  from
        a:hover {text-decoration:none; cursor:hand;  }
    and also deleting "background-color: #FFF !important;" from
        a.button:hover {display:block; width:135px;  [...other styles here ...]  background-color: #FFF !important;  }
    in the file main.css seems to help.
    But I had to test without all background-images, so this might be wrong.
    Both, the cursor and the bg color setting, seem to be redundand (BTW, you should use "cursor:pointer" instead of "cursor:hand;" - it wouldn't help in this case, but it's the crossbrowser way to do it).

    Also, do not use html comments inside css files!
    (Delete these in the css files:  <!--  -->  )

    also, instead of
     html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6 { margin: 0;  padding: 0;  border: 0;  outline: 0;}
    you could really say
    * { margin: 0;  padding: 0;  border: 0;  outline: 0;}       -   the star means "all" in this  context...

    Author Comment

    Well how strange.  You're right, it does sort it out.
    How on earth can a bgcolor make a difference???
    So I can't have cursor:hand then?  They were quite keen on it.

    The comment tags were included by default by Dreamweaver when I created the css page, are you sure they need to come out?  Thought it was some browser thing, I suppose for those which don't recognise CSS?

    But anyway - thank you, it works and you're a life-saver.  It's been driving me up the wall!

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    What Is Threat Intelligence?

    Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

    So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
    #Citrix #Internet Explorer #Enterprise Mode #IE 11 #IE 8
    This tutorial demonstrates how to identify and create boundary or building outlines in Google Maps. In this example, I outline the boundaries of an enclosed skatepark within a community park.  Login to your Google Account, then  Google for "Google M…
    This tutorial walks through the best practices in adding a local business to Google Maps including how to properly search for duplicates, marker placement, and inputing business details. Login to your Google Account, then search for "Google Mapmaker…

    761 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    11 Experts available now in Live!

    Get 1:1 Help Now