The product layout page's messed up

[adambrgmn]

Hi,

First of, great theme! It’s a pleasure to use Neighborhood on my webshop.
Although I have encountered some minor problems, for example:
If you click on: http://concretehumanity.com/product-category/tshirts/ you’ll see that some t-shirts aren’t parallel to each other. What’s the solution for this?

Thanks in advance!

Best regards,
Adam

[Melanie – SUPPORT]

Hey Adam,

great Tshirts (and model hehe) – I see all the items aligned perfectly, can you show me a screenshot and let me know the browser and OS you’re seeing this on?

Cheers

[adambrgmn]

Hi,

Thank you! 🙂

I forgot to mention that you need to visit the site on a mobile device. I’m using iPhone 5. Although I managed to fix the issue with the products, now the single product page’s messed up instead.

I have looked into the responsive file and there it already says that the width should be 100 % so I can’t understand how it can be like that. Do you have a solution for this?

Best regards

[Kyle – SUPPORT]

Hi

I agree, some nice t-shirts! Please could you provide me with a login so that I can look into the issue?

– Kyle

[adambrgmn]

This reply has been marked as private.

[Kyle – SUPPORT]

You have 5 updates available, please update and let me know if the issue still occurs

– Kyle

[adambrgmn]

Both WooCommerce and Neighborhood has now been updated. I haven’t updated WordPress to 3.9.2 or WooCommerce Store Exporter, since they shouldn’t affect the layout on the product page.. Still the same problem though.

[Kyle – SUPPORT]

Check now, you didn’t put your new product page widths in a media query, so I’ve done this for you

– Kyle

[adambrgmn]

Yes, that solved it. Thanks a lot! How did you put the product page width in a media query?

[Kyle – SUPPORT]

@media only screen and (min-width: 769px) { 
/* IMAGE AREA */
.woocommerce div.product div.images {
width: 44%;
}
/* DETAILS AREA */
.woocommerce div.product div.summary {
width: 54%;
} 
}

– Kyle

[adambrgmn]

As a matter of fact, I think I did. I did this in my custom css.

@media only screen and (min-width: 769px) { 
/* IMAGE AREA */
.woocommerce div.product div.images {
width: 44%;
}
/* DETAILS AREA */
.woocommerce div.product div.summary {
width: 54%;
} 
}

Or are there any errors in this code?

[Kyle – SUPPORT]

No I did that for you, before all you had was

/* IMAGE AREA */
.woocommerce div.product div.images {
width: 44%;
}
/* DETAILS AREA */
.woocommerce div.product div.summary {
width: 54%;
} 

– Kyle