Yesterday, a QQ friend asked the following question:
<Style>
* {Margin: 0; padding: 0 };
IMG {border: none ;}
A: hover IMG {border: 4px solid red ;}
</Style> <body> <a href = "#"> </a> </body>
The IMG style does not change when you hover over IE6. From the code point of view, there is no problem at all.
At that time, I also tested it. It did not work. Due to work reasons, there was no time, so I put it on hold until today.
I tested this demo again just now. I didn't think it was a haslayout problem.
A demo was posted in the CSS forest group. A student gave a solution for a: hover {Background: # CCC.
I thought it was caused by haslayout.
Then we tested the following two attributes. Both of them can be implemented.
<Style>
* {Margin: 0; padding: 0 };
IMG {border: none ;}
A: hover {overflow: hidden;}/* method 1 */
A: hover {ZOOM: 1;}/* method 2 */
A: hover {Background: # FFF;}/* method 3 */
A img {border: 1px solid red; width: 86px; Height: 86px ;}
A: hover IMG {border: 4px solid red; width: 120px ;}
</Style>
All three methods can achieve results.
It may be used in future projects. Record it first.
If you have a better solution, please leave a message !!