Flexible product listing CSS Issue

[Empire]

I am in the the process of setting up a new Zen Cart site (v1.3.8a) and am having a problem getting the product listing page to look the way I want it to.

I have installed the "Flexible product listing" add on set to display the products in rows so I can have better control with the layout and have got it close to where I want it but am having some issues with the price and add to cart sections not centering vertically. I am pretty sure it is a CSS issue but am not sure what I need to change.

You can see the site here http://www.gracoworld.com/index.php?...ndex&cPath=1_5

Any help would be greatly appreciated.

[kobra]

I would add some transparent space to the top of your image
Yeah not css nor eloquent but will get it done

[Empire]

Thanks for the reply Kobra I just gave that a shot but it actually just pushed everything down and the price is still sitting to high anyway. If you or anyone else has any other ideas I would be glad to here them.

[niccol]

Well, it is partly a css issue.

Things that are a bit unusual in this bit of the layout are:

1. We are in a table. The vertical align of the cells is at it's default which is align vertically to the center. Changing this is very possible and involves a bit of a code edit. In tpl_tabular_display.php find the line that has the <tr> tag and chang it to something like:

<tr valign=top <?php echo $r_params; ?>>

Evidently that will line all the table cells to the top. At least it gives you something to work off.

2. I was going to make another point but having looked at your source code it turns out it was wrong!

Emulating valign:center in css is notoriously problematic. It is much easier to change the vertical alignment to top and then work with margins to put the elements where you want them to be.

Nik

[kobra]

This is not fully straight forward and you should start following this display starting with the tpl_modules_product_listing.php file which also references tpl_tabular_display.php.
It appears that you have already touched this display as it is not as a default would be

[niccol]

OK . I will clarify in my next post. Food first!

[kdb04d]

It actually looks like a html issue to me the price, form quantity and the amount are in the same <td class="listingPriceCell"> each should have their own then they will center themselves on their own