Responsive Theme Stylesheet Customisation

[Mantra]

I used SellerDeck 2014 to auto configure our existing site layout to the Smart Respoinsive Theme just to see how it looked. Surprisingly this worked but there quite a few apsects provided by the new style that I did not like.
The existing site has 5 table columns whereas the new theme stylesheets appear to have only 3 with options to utilise 1, 2 or 3.
The first column is fine but i would like to have a centre/column 2 that can be split into 3 columns so that an image can be left in the left, with product description in the next column with price line below followed by order button on the price code line so that product description is not wrapped around image and order button is not using up a separate line.
Also product description text line spacing seems much too large compared to choice of text.
The wrap round of the product description text, oversized line spacing and extended depth by having an oversized order button on the line below the price line looks messy and unprofessional in my opinion.
Any suggestions to overcome these issues would be much appreciated.

Martin
Mantra Audio
www.mantra-audio.co.uk

[John Ennals]

If you adjust the line-height, the spacing of lines in the product description will look better. These are the settings I use for product text (add this to the bottom of the theme stylesheet):

.product-text {
	font-size:1.4em; 
	line-height:150%;
	clear:none;
}

John

[Mantra]

Thank you, John
I will try this setting adjustment.
I note from your site that the centre column is more in line with what I am seeking as text is not wrapped around left image and order button is to the right side. Is this something that can be achieved with default theme stylesheet options or is some further development needed to achieve this? Combining the centre and right side column as one would work best for me as I have a lot of detail under some product descriptions.

Martin
https://shop.mantra-audio.co.uk/acat...ca_stylus.html

[John Ennals]

Martin,

I did quite lot of tweaking to the Smart theme by modifying CSS and creating my own layouts (in the Design Library you can make copies of standard layouts to create your own). Probably the best thing to do is to have a look at an existing site, mine if you like, using Firefox with the Firebug add-in. This lets you examine the page structure and the underlying CSS. Any CSS you add to the bottom of the theme stylesheet will override the standard CSS earlier in the stylesheet. Therefore if you add your own CSS and it doesn't work, you can delete it to get back to where you were with no damage done.

John

[Mantra]

John
Thanks again.
Customising CSS styles will be new to me but I am keen to have a go. This will take a little while as I need to smooth a few things out on the existing site first and this is our busiest time of year.
My plan is to complete the refinement of our existing site and then try out some responsive design themes development during SellerDeck 2016 upgrade evaluation trial period using SellerDeck 2014 site snapshop design content to implement on SD2014 for upgrading to SD2016.
Regards
Martin

[John Ennals]

http://www.w3schools.com/ is a good reference source. Have fun!

John

[Mantra]

Smart Responsive Design - Tabber Placement

I am trying out some Smart Responsive design development for upgrading my existing site and have tabbed descriptions set up for some products.
The layout I am using for the product page is Product Page Body RWD>Image on Left Text Wrapped Around>Standard Product Image with tabber placement set to "<div class="tabber-placement set right">" within Product Description (sample test).
This gives result shown in the snapshot attached.
Question is has anyone got any ideas on how price could be relocated to appear beneath the image to enable the tabber to span the full width available on the right side of the image or any other suggestions to achieve this outcome?
Martin
Mantra Audio
www.mantra-audio.co.uk