Docs

[Kevin C]

Hi all,

The product image and description used to be aligned horizontally but I don’t know when this happened.

Kindly advise on the possible css/update that I may need to do.

http://vivreactivewear.com/shop/bottoms/movement-active-tights-ii/

Will try to upload screenshot if I can later on. (current file size is too large)

ps: I can only update plugin etc after Monday due to current sale promotion.

[Rue Nel]

Hello There,

Thanks for writing in! Regretfully the screenshot were not uploaded correctly because it exceeds the allowable file size. Please re size it and re upload it again. To assist you with this issue, you can provide us with your URL of the page in question. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thank you in advance.

[Kevin C]

Hi Rue Nel,

Uploaded a screenshot. http://vivreactivewear.com/shop/bottoms/rhythm-active-crops-ii/ This is the link. However, the mis-alignment is for all product pages.

The name of the product used to aligned at the top just beside the image.

[Christian]

You have this code in your CSS

.jck-wt-all-images-wrap {
    float: none;
    width: 42%;
}

Please remove it.

Thanks.

[Kevin C]

Hi Christian,

Please advise where I can find this code to remove it.

I have tried “customiser” & function file and yet I cannot find the code that you have mentioned.

[Joao]

Hi Kevin,

Please take a look on Appereance > Customizer > Custom > CSS and on the style.css of your Child Theme.

If you don´t manage to find it, would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks

Joao

[Kevin C]

This reply has been marked as private.

[Nabeel A]

Hi again,

Thank you for providing the credentials. Try deactivating WooThumbs – Awesome Product Imagery plugin.

Let us know how this goes!

[Kevin C]

Tried that and it fixed the problem. Is there anyway I can edit CSS to make it work properly?

[Joao]

Please add the following code to Appereance > customizer > Custom > CSS

.woocommerce div.product .summary {
    margin-top: -48%;
}

Hope it helps

Joao

[Kevin C]

Hi Joao,

This fixed the issue nicely.

Thank you.

[Nico]

Happy to hear that.

Feel free to ask us again.

Thanks.

[Kevin C]

Hi,

I have discovered that this fix should not be applied for mobile site as the alignment is off for mobile devices.

Is there anyway to fix this without affecting how it will look on computer?

I have attached the screenshot.

http://vivreactivewear.com/shop/bottoms/danseuse-performance-tights-2/

Link. You will be able to see the issue with mobile devices.

ps: is there anyway to edit the css so that it applies for laptop/computer only?

.woocommerce div.product .summary {
margin-top: -48%;
}

[Nico]

Hi There,

This code below will be applied to all devices.

.woocommerce div.product .summary {
    margin-top: -48%;
}

To make it applied in desktop only. You could add media queries to the code.

for example,

@media (min-width:900px){
.woocommerce div.product .summary {
margin-top: -48%;
}
}

It will be applied to 901px above screensizes.

Hope it helps.

Let us know how it goes.

Thanks.

[Kevin C]

Hi Nico,

This code helps.

Thank you once again.

[Author]

Posts