Please go to these pages from Webkit browsers (first) and Firefox.
There shouldn't have padding top for the image for "We Recommend", padding top
is caused by the "padding-left:13px;" – any value will trigger the padding in
the EVEN set of the floated block in Webkit browsers [1].
a[href^="http"]{background: url(icon-external.png) no-repeat right
3px;padding-left:13px;}
http://jsbin.com/ozeqon [1]
If you change "padding-left" to "padding-top" or "padding-bottom", the extra
padding goes away.
In these two examples the paddings are gone.
padding-top
http://jsbin.com/ozeqon/3/
padding-bottom
http://jsbin.com/ozeqon/5
[1] If you check the page from Firefox, you will see that all images have
padding (top) above image (this is the reason for my "or Firefox" in the
subject line), however in my origninal code I had "padding-right:13px
(which is why I first thought it's webkit bug - all in all wasted my 3
working days to find the cause and I assure you nobody can't imagine how upset
I was when I found what caused the issue – and I think I will go jump from the
bridge if anybody going to tell me the padding in the above rule isn't the
issue but my other CSS codes).
a[href^="http"]{background: url(icon-external.png) no-repeat right
3px;padding-right:13px;}
http://jsbin.com/ozeqon/4/
Let see what padding:13px does. It's identical to "padding-left:13px;" above.
http://jsbin.com/ozeqon/6
tee
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*******************************************************************
