CODEWITHSUNDEEP
htmlcss
vvMINOvv
vvMINOvv

Reputation: 1850

FF/IE position:absolute bug

It seems Chrome is the only browser rendering my code the way I want.

If you notice my position:absolute is changing as the border size increases (in FF and IE) however is unaffected in chrome (which is exactly what I want).

Here is a demo Please try it in chrome/ie/ff to see the difference

The primary purpose of all of this black magic is simple, I need the .thumb:after to always be in the center of .thumb . If you know a better way let me know.

Upvotes: 1

Views: 159

Answers (2)

DaiYoukai
DaiYoukai

Reputation: 1898

Edit: Fixed -- Checked in FF and Chrome (Don't have newer versions of IE)

http://jsfiddle.net/AyCKU/8/

Took out margin: 0 auto, just left it at using %'s for top and left and negative margins.

Basically: Used one of the methods for Vertical centering in CSS (Using 50% and negative margins) and applied it to both vertical and horizontal centering.

Upvotes: 2

Anon
Anon

Reputation: 94

I messed around a little in Chrome + FF and noticed if you change:

.item .thumb:after

If you change the positioning to fixed and center it properly it will work in both browsers.

Give it a shot in IE and let me know if it works ..

Upvotes: 0

Related Questions