Price Next to Product Name

Hi,

I've been looking for several days on a thread on how to put my product price next to (the right of) my product name on the product display pages.

I believe I have to edit the tpl_product_info_display.php page but I really don't know how. From what I've read for other things it seems that I might need to add some <div> tags. Really not sure what to do.

If anyone could help me with this layout change I would really appreciate it.

Thanks:smile:

Do you mean immediately following the name, or on the same horizontal level? Bear in mind that product name lengths vary, but one way of doing it without touching the code is to use CSS... add the following to your stylesheet to put it on the right hand side of the centre column.

#productPrices{
float:right;
position:relative;
bottom:30px;
}

adjusting the 30px to get the height right.

Instead of bottom:30px; you could use top:-30px; depends on which gets you exactly what you want.

Remember also that any Sale or Special price will appear underneath your Price.

Thank you for the information on having the price on the same line as the Product name. I know I'm being really dumb about this but is there a way to bring it a bit closer to the product name?

The name is left and the price is now float right, so over on the right edge of the page.

Actually, here is the page url: http://69.89.31.83/~egallant/ZenCart/index.php?main_page=product_info&cPath=1&products_id=1

Thank you. I'm really trying to brush up on my CSS but I seem to need to make changes faster than I can fully grasp what needs the changing.

Amy

One other quick thing if anyone views the page. In IE the attribute name and the field (drop down list) line up pretty well horizontally but in Firefox they are way off.

The field name is below (but still to the left) of the drop down box. It's driving me crazy. When i try to fix it then it gets all messed up in IE.

My customer is on a PC so I have to have the PC version perfect but it really bugs me that the mac version looks so bad. I've check other peoples site and for the most part the names and fields are lined up well in both IE and FF.

It's the little things that drive me crazy:shocking:

awhite:

is there a way to bring it a bit closer to the product name?

After the position: relative; you can add left: XXpx (or right: XXpx) to position horizontally...but if you have longer product names you could run into problems.

(If you want the price to always appear exactly the same distance after the name, then you will need to abandon the css approach and edit the code in tpl_product_info_display.php )

Solve all (well nearly all!) your CSS problems by getting it right in Firefox and then adding the IE Stylesheets "mod" from downloads. This allows you to create IE specific (even IE6 or IE7 specific) stylesheets to cope with IE's foibles!