Archived topic
Product short description - can't center vertically
3 replies · Started by Emil on December 1, 2020
Hello!
I'm using woocommerce + the latest GP for my online shop and it's fantastic, but I can't figure out how to vertically align the entire short description of a product in a single product page in relationship with the product image on its left. I've tried again and again, but for the life of me I can't figure it out.
As an example, here's a product page for which I'm trying this edit. I've tried editing the summary entry-summary section using the following snippet, but this breaks the whole layout:
position: absolute;
top: 50%;
transform: translateY(-50%);Am I looking at this issue the wrong way? Is this even achievable?
Thank you!
Hi there,
try this CSS:
@media(min-width: 769px) {
.woocommerce.single-product div.product {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.woocommerce.single-product div.product div {
flex: 1 0 100%;
}
.woocommerce.single-product div.product .woocommerce-product-gallery,
.woocommerce.single-product div.product .entry-summary {
flex: 0 0 48%;
}
}Hi David!
The solution you provided me with worked like a charm. Thank you so much for your time, I really appreciate it!
Kind regards, Emil.
Glad to be of help!
