CSS positioning breaks in Safari

Question

i have a website in which i am trying to position (using CSS) a certain on the page. the is absolutely positioned and is located inside a relatively positioned paernt . on firefox and even IE it looks ok but on Safari, things get messy and it shows 5 pixels lower than it should. i have tried to figure out for days now what is wrong there but cannot seem to see it.

you can find an example link to the problematic page here: http://yaronattar.com/index.php?option=com_content&view=article&id=117:the-new-lovers-2010&catid=51:the-new-lovers-2010&Itemid=242

the problematic is the one conaining the "previous/next" navigation at the bottom right corner of the page.

anyone sees what is causing the trouble here?

thanks

Answer 1

This will target webkit browsers only (Chrome, Safari and I think a version of Opera too)

@media screen and (-webkit-min-device-pixel-ratio:0) {
    /Chrome and Safari CSS here/

    #id-name {
        position:absolute;
        width:100px;
        height:100px;
        left:100px;
        bottom:100px;
    }
    }