Question

I have a layout with a middle aligned paging.

The paging is middle-aligned be this trick:

.pager_wrap
{
    float: left;
    position: relative;
    left: 50%;
}
.pager 
{
    float: left;
    position: relative;
    left: -50%;
}

This seems to be working fine.

But there was a request to add a facebook like button the right side of the pager, but NOT affecting the position and middle alignment of the paging.

I was thinking about somehow putting the facebook like in a div right after the .pager-wrap div, and somehow modifying its vertical alignment to be over the .pager-wrap div.

I’m no mage in css and these kind of problems tend to take extremely long time to figure out. Can someone help me out on this one?

Answer 1

Place the facebook icon in a div, position it relatively, float to the right and if needed apply a z-index to bring it higher on the stack.