I've run into a problem trying to do something that at first glance seemed pretty straight forward to me.
http://www.erik-porter.com/test/index.html
I have a simple 2 column centered layout with a group of products in the main column. Each product is in a div that is floated left so that there are three to a row. I want to be able to add a new icon on top of the product photo dynamically using absolute positioning for the new graphic, but the 'position: relative' on the product div is being ignored in safari and Moz/Netscape because the div is floated. So the new graphic is appearing in the top left of the browser window instead of the top left of the product box.
Any thoughts on why this is happening or how to get around it without nesting another div?
floated box ignoring position: relative in safari/mozilla
Did you fix this?
In Moz FB it now looks ok
Regards
Day