why my "related products" is in vertical?

[sumsonchen]

looks very strange.
http://www.weixin-china.com/products/other-products/silicone-tmj-tmd-tray-detail.html

How can I fix the problem?

[attachment cleanup by admin]

[PRO]

U need to add the css


.product-field product-field-type-R{width:25%;float:left;}

[sumsonchen]

Thanks, "Banquet Tables Pro".
I added .product-field product-field-type-R{width:25%;float:left;} to vmsiteltr.css, but didn't work.
Or should it be added to another css file?

[sumsonchen]

Hi "Banquet Tables Pro".

That is amazing.
I just add a dot and it works. Very very appreciate your help

.product-field.product-field-type-R{width:25%;float:left;}

or

.product-field,product-field-type-R{width:25%;float:left;}

[finbarr69]

This is very good, but when there are fewer than four related products, the "Reviews" section tags itself on the right hand side (and its horizontal rule separator runs through the middle of the related products.  Any ideas how to reserve the rest of the space so that reviews is forced underneath related products?

Thanks!

Brian

[PRO]

You need to add a clearing div after then, and before the reviews

[finbarr69]

Ah ok, I'll try that.  I guess that will be a template override.

If I figure it out, I'll post the code back on here.

Thanks,

Brian

[sentnel]

Not sure if is wrong to bring back this old post, but since is directly related I'll ask here:
- Im getting my related products ok, in a row, but there's no way I can get the image to be centered above the text. The image shows floating left, while the text is centered. Can somebody tell me where, in the .css can I centered the image?

Thanks a lot!

Edit: Update: See the problem ("Productos Relacionados")

http://inposdom.gob.do/filatelia/index.php/component/virtuemart/conmemorativas/125-anos-relaciones-consulares-dominico-ecuatorianas-detail?Itemid=0

Joomla 2.5.7
Virtuemart 2.0.12b
PHP 5.3.3

[sentnel]

Solution:
change:

.product-field-display a img{display: block;}

to:

.product-field-display a img{display: block; margin-left:auto; margin-right:auto;}

in:
components/com_virtuemart/assets/css/vmsite-ltr.css

[maverickon]

Although this topic has not been visited recently, I came up by searchangin at this page so I thought someone else might benefit.
1. I added in custom css file optional for my template:
.product-field,product-field-type-R{width:25%!important;
float:left!important;} - this keeps it untouched in cas of an upgrade.
Alternatively step one might be added directly in vmsite-ltr.css, but this will be changed when upgrade is made.
2. Find file    ...........     /components/com_virtuemart/views/productdetails/tmpl/default_relatedproducts.php
add at the end
 <div style="clear: both;"></div>

This solved it in my case.

[Milbo]

Thank you.

[dsidir]

U need to add the css


.product-field product-field-type-R{width:25%;float:left;}

Having exactly the same problem. Could you please tell where exactly this code should be added ? I tried some thing bud didnt work. Using VM 2.9.9

[GJC Web Design]

.product-field,product-field-type-R{
width:25%!important;
float:left!important;
}

in any css file that is loaded

[dsidir]

any specific "line" or at the end of the file it doesnt matter?

[GJC Web Design]

just try it!  You will then learn something from your experience - i.e. how css rules work....