Issues with Images

I am using this code:

Code: Select all

img {
    height: auto;
    max-width: 100%;
    padding: 20px 0 10px;
}

to give even whitespace above and below the logo and to center the images within the price table:
http://development.fourier.com.au/f2/

The problem is this code makes the tick images and the icons on other pages eg http://development.fourier.com.au/f2/product-services/onsite-remote-support/ all messed up.

Can you please help with the override.css to get the even whitespace above and below the logo, center the price table images AND keep the tick images and icons looking neat as well.

Thanking you.
S

Hi,

If you want to use this code only inside the price table, please try this code:

Code: Select all

.gk-color-price-table img {
    height: auto;
    max-width: 100%;
    padding: 20px 0 10px;
}

Thank you again.

Can you please also take a look at the middle column of the pricing table here: http://development.fourier.com.au/f2/

The heading is cut off in responsive formats. I tried making the heading the same size as the other two but it still gets cut off.

S

Hi,

Try to add this code at the end of tablet.css file:

Code: Select all

.gk-color-price-table .gk-premium dt {
   margin-top: 15px!important;
}