text and price to the right of image in Related Products

[AdamKing]

Hi everyone

I have enabled the Related Products option in the marketing setting and the list shows the image and title and price, which is all good. However, it puts the title and price underneath the image, leaving a lot of white space....is it possible to lay out these bits to the right of the image?

see below link for example

http://www.harveymaps.co.uk/acatalog...rs-YHBMNY.html

Also, as an aside to this problem, when the link above is viewed in firefox, there appears to be less padding than normal, as viewed in Explorer for example. I have also noticed this throughout the test site on many other list type layouts, the home page for one (even though the fragments are not finished). Any help with this too would be greatly appreciated.

Thanks

Adam

[peblaco]

It looks like you already adjusted that one. By default the layout puts the image above the title and price and requires an adjustment to the layout / CSS. The padding issue you added a second more specifically named post see a reply there.

[AdamKing]

Hi louise, yes, i managed to do this one using the same approach that you suggested to me for something else. Filtering options I think, and blanking out the float css property that seems to put things on the ines below.

[demalpas]

Hi everyone

I have enabled the Related Products option in the marketing setting and the list shows the image and title and price, which is all good. However, it puts the title and price underneath the image, leaving a lot of white space....is it possible to lay out these bits to the right of the image?

see below link for example

http://www.harveymaps.co.uk/acatalog...rs-YHBMNY.html

Also, as an aside to this problem, when the link above is viewed in firefox, there appears to be less padding than normal, as viewed in Explorer for example. I have also noticed this throughout the test site on many other list type layouts, the home page for one (even though the fragments are not finished). Any help with this too would be greatly appreciated.

Thanks

Adam

I would be interested in how you did this - i.e. what changes you made to the style sheet to achieve the image on the left and the text and price on the right. I am having a hellava tussle with it!

[AdamKing]

Hi Mike

I achieved this using a workaround Louise suggested to me for something else.

You need to go to Design > Library > Theme Stylesheets and double click on Responsive CSS. Towards the bottom of the sheet (line 977 on mine) you should find a css style that looks like this:

form div.product-marketing-list .marketing-list-entry .product-text p,.product-marketing-list .product-list-price .product-price {float:left; clear:both;}

You can simply block this line by enclosing it with /* and */, so it looks like:

/*form div.product-marketing-list .marketing-list-entry .product-text p,.product-marketing-list .product-list-price .product-price {float:left; clear:both;}*/

The title and price should fall alongside the image now. That worked for me, hope it helps you too

Adam

[demalpas]

Hi Adam,

Thanks so much for your response. I will try it tomorrow and report back.

I am glad to hear you discovered the wonderful Louise too - she is a genius(!) and helped me no end.

Thanks again,

Mike

[demalpas]

Adam,

I have tried your suggestion but for me, unfortunately, it didn't work. I tried just adding that line you suggested into my actininc.css Style Sheet in the Related Products section - that had no effect and I also tried including the ResponsiveCSS style sheet into my actinic.css style sheet - but again it had no effect.

I suspect the reason is that my style sheet differs substantially from yours and there is something in it that is overriding your suggestion.

Never mind, I will live with it for now. Thank you again for responding to my request for help

Kind regards,

Mike

[AdamKing]

Hi Mike

Instead of adding that line into the stylesheet, i would suggest simply changing the existing line instead? In other words try finding the line...

form div.product-marketing-list .marketing-list-entry .product-text p,.product-marketing-list .product-list-price .product-price {float:left; clear:both;}

...and then simply amending that one by blocking it out as suggested. I suspect if you add a completely new line in then the original entry is still governing the css.

Worth a shot anyway.

[demalpas]

Hi Adam,

Thank you for your suggestion.However looking at advice from Louise, it would appear that the issue concerns more than just the style sheet. If I have understood it correctly, the style sheet is implemented in the Layout and we are using a SellerDeck 2013 Layout and not a SellerDeck 2014 Layout - actually it is more than one layout. So ... it is not enough just to change the style sheet because that won't work without the correct SD2014 Layouts.

Thank you again for trying to help - that is very kind. However, we are now content to wait until Louise upgrades the site for us (possibly with a new design) at a time to be decided to the latest stable SellerDeck software.

Kind regards,
Mike

[kev67]

I found this an excellent thread although I wanted my title and price above the image and central to fit in with the rest of the site

I've managed to center the title all be it below the image still (Which I don't like) but the price is not only HUGE TEXT but it's to the left

Any idea what line I need to find to change this please?

Like others, I've spent hours on this and my brain is about to blow up, thanks