Clever Geek Handbook

Chrome - problem with "width: 0px"

I seem to be having a strange problem in Chrome, with "width: 0px". I am setting the width to 0 to partially hide the link. On mouseover, I am showing a link, with a simple animation. While Firefox and Opera behave nicely, in Chrome I can see the displayed link text even though the width is set to 0 . (in IE and Safari, I can't check right now)

For your convenience, I have added some code in a fiddle, here: http://jsfiddle.net/mihaidoru/yNzSH/

QUESTION: How can I make Chrome display the same as Firefox, only CSS if possible.

NOTE: the menu must respect CSS: "position: fixed, right: 0px".

Any help would be greatly appreciated.

Thank.

+3


source to share


4 answers


I set the width to 1px instead of 0px. This makes it so that a green background appears and when you hover over it, it expands as expected. I also changed it to 1px in your jQuery.



updated violin

+1


source


Install links overflow: hidden

.



+3


source


You can use css overflow property

overflow: hidden;
+1


source


overflow: hidden

doesn't work for me, try it display:none

; javascript reads fine.

0


source






More articles:


All Articles