How to align "Add to Cart" button on Products page

[woodbrothers]

Is there a way to align the “add to cart” button so all of these buttons align vertically on the products page? The # of characters in the title determine the addtocart button position.

The screenshot here, shows the buttons not aligning vertically. I’d like a uniform layout for these fancy7 shortcode styling.

Awaiting a reply

[Peter]

Hi,

You should be able to use CSS tweaks to set a consistent margin or padding.

To do this it is recommended you use firebug to experiment with the CSS code.

See this post for how to use firebug:

http://www.tipsandtricks-hq.com/how-to-use-firebug-to-modify-your-wordpress-sites-css-video-tutorial-4037

[woodbrothers]

I’m familiar with Firebug and I did use it to see how I can align the addtocart button to the right of the estore_fancy7_main div class. In this way, it’ll control the title length without wrapping the text.

I read [http://www.devlounge.net/design/aligning-images-the-right-way-using-css] to find out what code I can use to align the button to the right side of the div

.eStore_fancy7_button{

float: right;

padding: 5px;

height:25px;

}

As such, all I had to do was use the “float: right;” property above.

[Author]

Posts