Solved

Line up price (change TD properties) on Zen cart

Posted on 2008-10-02
4
426 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
  • 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

Efficient way to get backups off site to Azure

This user guide provides instructions on how to deploy and configure both a StoneFly Scale Out NAS Enterprise Cloud Drive virtual machine and Veeam Cloud Connect in the Microsoft Azure Cloud.

Question has a verified solution.

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

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
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 embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

809 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