Solved

Line up price (change TD properties) on Zen cart

Posted on 2008-10-02
4
428 Views
Last Modified: 2012-05-05
Hi- To see the site, you'll need a user name/password, which are melody/magic.

On this cart I'd like to change the code so the TD properties  for  td class="productListing-data" has a vertical alignment of top. That would line the price up with the product name. So for instance, I would like to change this:

  <tr  class="productListing-odd">

   <td class="productListing-data" align="center"><a href="http://diabetic-meals.net/cart/index.php?main_page=product_info&cPath=1&products_id=39"><img src="images/7118.jpg" alt="Beef Tri-tip au Jus, Sliced - 2 servings" title=" Beef Tri-tip au Jus, Sliced - 2 servings " width="100" height="68" class="listingProductImage" /></a></td>
   <td class="productListing-data"><h3 class="itemTitle"><a href="http://diabetic-meals.net/cart/index.php?main_page=product_info&cPath=1&products_id=39">Beef Tri-tip au Jus, Sliced  - 2 servings</a></h3><div class="listingDescription">Meat-lovers rejoice! Here is an enticing meal of tender sliced grass-fed beef....</div></td>
   <td align="right" valign="bottom" class="productListing-data">$16.99<br /><br />Add: <input type="text" name="products_id[39]" value="0" size="4" /><br /><br /></td>

to this:

  <tr  class="productListing-odd">

   <td class="productListing-data" align="center"><a href="http://diabetic-meals.net/cart/index.php?main_page=product_info&cPath=1&products_id=39"><img src="images/7118.jpg" alt="Beef Tri-tip au Jus, Sliced - 2 servings" title=" Beef Tri-tip au Jus, Sliced - 2 servings " width="100" height="68" class="listingProductImage" /></a></td>
   <td valign="top" class="productListing-data"><h3 class="itemTitle"><a href="http://diabetic-meals.net/cart/index.php?main_page=product_info&cPath=1&products_id=39">Beef Tri-tip au Jus, Sliced  - 2 servings</a></h3><div class="listingDescription">Meat-lovers rejoice! Here is an enticing meal of tender sliced grass-fed beef....</div></td>
   <td align="right" valign="bottom" class="productListing-data">$16.99<br /><br />Add: <input type="text" name="products_id[39]" value="0" size="4" /><br /><br /></td>
  </tr>
  </tr>
0
Comment
Question by:mel200
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 44

Accepted Solution

by:
scrathcyboy earned 500 total points
ID: 22629526
TD.productListing-data  {text-align:right; vertical-align:top; }

in CSS will do it.  The right is to line up dollar amounts if you need it, and the vertical align can be either "top" or "text-top" -- whichever works better for you.

So vertical-align:top;   and   vertical-align:text-top;   can give you two different alignments.  Try them.
0
 

Author Comment

by:mel200
ID: 22629567
Thanks- I'll try that right away!
0
 

Author Closing Comment

by:mel200
ID: 31502598
Works like a hot damn! Thanks!
0
 
LVL 44

Expert Comment

by:scrathcyboy
ID: 22629992
glad it worked for you!
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Introduction This article is intended for those who are new to PHP error handling (https://www.experts-exchange.com/articles/11769/And-by-the-way-I-am-New-to-PHP.html).  It addresses one of the most common problems that plague beginning PHP develop…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
The viewer will learn how to count occurrences of each item in an array.

726 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question