Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

Mobile: Product Page

  • I am aware that you cannot help with this. But perhaps you could assist me.

    How can I center everything when using a mobile device?


  • Hi Maaa,

    The only section not center aligned on mobile is the tabs part. Do you want to align it like this?:

    The bullet point looks weird so I removed it.

    The code for this is:

    @media (max-width: 768px){
        .single-product .woocommerce-tabs.wc-tabs-wrapper div#tab-description {
        text-align: center;
    .single-product .woocommerce-tabs.wc-tabs-wrapper div#tab-description ul{
        list-style: none;
    .single-product .woocommerce-tabs.wc-tabs-wrapper div#tab-additional_information {
        text-align: center;
    .single-product section.related.products {
        text-align: center;
    .single-product form.cart .quantity.buttons-added {
        flex-basis: 100%;
        justify-content: center;
    .single-product form.cart button.single_add_to_cart_button {
        margin-top: 20px;
    .single-product form.cart {
        justify-content: center;
  • Hi Fernando, yes. Thank you very much.

  • You’re welcome, Maaaa!

  • Hi Fernando, one more thing. How to put the add to cart button under quantity so all alignments are centered? Thank you!

  • I updated the code above. Can you update the one we had before with that?

  • It works with the code you provide. Thank you Fernando!

  • You’re welcome, Maaa!

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.