Geek Answers Handbook

Error Strange Border in FireFox

I was already messing around with JS and CSS. I have an anchor with a common button style. In styling, I have border-bottom: 5px dotted blue; . Then JS:

 onmouseover = "this.style.borderBottom = '5px solid red';"

He is an example of JSFiddle: http://jsfiddle.net/MichaelMitchell/f4Ud4/ Hover over the button

It seems that the border is crossing, can someone explain? This is only visible in FireFox due to the way Chrome handles dotted borders.

+4
source share
1 answer

I can not explain the behavior of the buggy. Obviously, firefox does not clear the drawing area when drawing a different border.

But here is a (dirty) solution

 <a class = 'testButton' href = '#' onmouseover = "var button = this; button.style.borderBottom = '0px'; setTimeout( function() { button.style.borderBottom = '5px solid red'; }, 1 )"> Button! </a>
+2
source

More articles:


All Articles