Hi.
I love your theme.
I find it usual easy enough to customize but i am having trouble getting WooCommerce single Page layout with variable to center the heading instead of being on the side. I would like it to be centered above the variable option.
Could you help please with some css advice.
Attached is a screen shot.
https://www.dropbox.com/s/2hl9rr36vy24d97/1.PNG?dl=0
Hey OneClickTech!
Thank you for using Enfold.
Use this in the Quick CSS Field:
#top .variations td.label, #top .variations td:nth-child(2) {
width: 100%;
display: block;
}
Best regards,
Ismael
Thank you Ismael. That worked.
I then add the below code for the Recipient Name which worked with a few more edits.
#top .woo-vou-recipient-fields td.label,#top .woo-vou-recipient-fields td:nth-child(2) {
width: 92%;
display: block;
margin-left: 10px;
border:hidden;
}
Could i ask for one more edit. How do i center the add to cart button.
https://www.dropbox.com/s/told4xomn84ygpu/333.PNG?dl=0
Thank you so much.
Hi!
hm what exactly do you want to achieve? do you want to move the words “Add to cart”? if yes use this code:
button.single_add_to_cart_button.button.alt {
padding-right: 30px;
}
and adjust as needed.
Best regards,
Andy
Hi Andy.
Thank you for getting back to me.
It was actually to center everything inside that red box. As you can see its slightly of set and when responsive its noticeably not centered.
Hope that makes sense.
Hi!
Use this:
div form.cart div.quantity, #top form.cart .button, .single_variation {
float: none;
margin: 5px auto;
text-align: center;
display: block;
}
.single_variation_wrap {
margin: 10px 0px 20px 0px;
}
Cheers!
Ismael
Thank you Ismael.
Most appreciated.