Responsive layout

OK thanks - tried it but will leave it as it is.

Can someone resolve this issue {product heading hidden behind rotated product image view when viewed on mobile device. Tried below but made no difference. Thanks Barry

ivan.milic wrote: Nothing can be done except this (add to bottom of template_css.css) :

@media all and (max-width: 476px) {
.product_intro h3 a{
position:absolute;
}
}

taht will enable text to be visible but it will move picture up leaving only tiny image corner to be visible

This will work, add to bottom of template_css.css:

@media all and (max-width: 512px) {
.product_intro h3 a{
position:relative!important;
z-index:10!important;
}
}

Im having the same problem. What about changing the z index of h3 instead? If so, what should I change it to?

This template is great but not as responsive as I had hoped. Some in the header area I can fix in the css myself. On the featured article pages where I have 2 or 3 cols, as you go to a smaller screen, the page still has same number of cols. It would be nice if it went to 1 col on smaller screens. Can I do this with a media query? and how? Here is the link: www.soundaudio.biz/index.php/en/products/aa-speakers.html

Well you don't use default template pattern, template is not designed to have multiple columns.

For previous question it would be:

@media all and (max-width: 512px) {
.product_intro h3{
position:relative!important;
z-index:10!important;
}
}