Center resized image in magento,
The problem I'm facing now can be seen here:
The code showing the products is this:
<ul class="products-grid spec-grid spec-grid3col grid-actions-absolute"> <?php endif ?> <li class="item<?php if(($i-1)%$_columnCount==0): ?> first<?php elseif($i%$_columnCount==0): ?> last<?php endif; ?>"> <div class="title-over-image"><h2 class="product-name"><a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($_product->getName(), null, true) ?>"><?php echo $_helper->productAttribute($_product, $_product->getName(), 'name') ?></a></h2></div> <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" class="product-image"><img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->directResize(176,176,4); ?>" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" /> </a> </li> <?php if ($i%$_columnCount==0 || $i==$_collectionSize): ?> </ul>
.products-grid .item { float:left; width:180px; position:relative; /* For stickers (e.g. "new" and "sale") positionning */ }
Also, I want to show only the centered 176x176 px from the resized image.
Anyone knows how I can do this?
Industrial Cooling Tower Manufacturer
TowertechIndia