Detail Product pages do not behave responsive, essential parts are cut off

[katerine]

Dear support team,
my client is wanting to go online today, but realized yesterday, that there are problem converning the responsive behaviour of the website, especially in the shop area, when it comes to the single product pages.

If you visit a product page for the first time, the whole product name is ledgible and the two images and description of the product are appearing. what does look a bit strange, is that the price and descpription part are just shown half of the width of the screen. is there a possibility to change a setting to use the whole width?

Besides the main problem is, that the possibility to choose the color of the bracelet, which is a drop down, is not visible any more, because it’s out of the screen to the right. but no possibility to scroll or something. when clicking on “farbe des Nylonbandes” you can still reach the drop down somehow, but after that, the whole visual appearance changes so that imagery, text and the product caroussel at the bottom part are cut off to the left in parts. This is really strange and for sure not the quality a good website for a shop should perform like.

To make the check easier, i have just added a link, where i have tested the mobile behaviour and you can see the problems, I am talking about:
http://mobt.me/CfC7

and a concrete sample for this non responsive behaviour:
http://loveshamburg.de/shop/armbaender/sam-versilbert/

How can we fix that?

Best and many thanks,
katerine

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Hi

That’s because you have this in your custom css:

.woocommerce div.product div.summary {
  margin-bottom: 100px;
  float: right;
  width: 48%;
}

– Kyle

[katerine]

So, if i take this out of My css, the Problem will be solved?

Best,
Katerine

[Kyle – SUPPORT]

Yes

– Kyle

[katerine]

Thank you very much!
that solved my problem.

[katerine]

thanks

[Kyle – SUPPORT]

No problem