1 reply [Last post]
spaddywaddy's picture
Last seen: 7 years 24 weeks ago
Joined: 2015-03-04
Posts: 1
Points: 2

Hi There,

I'm new to CSS and HTML and i have done a short course online from codeacademy. I have set this website up gooseberryshop .co. uk using the ultimo theme. All of this was straight forward, and i got a developer to change the layout a bit. However, i'm determined to learn more and do it myself if i can. Its all well doing courses online, but i really need to ask questions and be pointed in the right direction sometimes.

The problem i have right now is this if you look at this product at the bottom are related products which is being displayed by an extenion i installed gooseberryshop .co.uk /shampoo/anti-dandruff-shampoo/kerastase-specifique-bain-exfoliant-purifant-anti-dandruff-shampoo-200ml.html The problem is the images are stretched.

I think this is the CSS when using Firebug. However, this also controls other images size if changed. How do i get the CSS to control just the images in the related products container?

img {
border: 0 none;
max-height: 100%;
max-width: 100%;
vertical-align: top;
* {
margin: 0;
padding: 0;


gary.turner's picture
Last seen: 1 year 24 weeks ago
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

I'm not seeing any

I'm not seeing any stretching, but perhaps my eye is not as critical as yours. To address those specific images, try using this selector, .page-banners .banner img {}

That's not tested and may even cause issues elsewhere; be sure to test thoroughly. The theme author has made things difficult to maintain and alter with his shabby use of non-semantic markup, class and id tokens.



If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.