CODEWITHSUNDEEP
htmlcssstyling
Genadinik
Genadinik

Reputation: 18639

How to align images and put information right underneath them

A long time ago, I would use something like the tag to align things vertically in columns, but as I understand it, that is rarely done now.

I am working on this product page: http://hiking.comehike.com/outdoors/hiking_tshirt.php

See at the bottom, the item photos are aligned together nicely in a row, but the prices underneath them, and the buttons to add to cart, are not aligned.

How could I align the prices and add-to-cart buttons to be right under the photos?

Thanks!

Upvotes: 0

Views: 93

Answers (1)

Joe
Joe

Reputation: 82594

I suggest grouping them, example, with a DIV

<div class="product">
    <img src="http://www.comehike.com/img/items/white_tshirt.png" height=100 width=100 />
    <p class="price">$20.00</p>
    <input id="cashieAddToCart7116" type="button" value="Add to Cart" onclick="_cashieButtons[7116].add()">
</div>

Upvotes: 1

Related Questions