Button block on Homepage

  • Resolved moraima4

    (@moraima4)


    2 years, 9 months ago

    Hi, I have a button block on my homepage that looks good on a PC but it looks terrible on mobile. I have changed all the settings I can think of and it doesn’t fix it. It’t the Details button for the free shipping offer. It looks nice and long on the PC but it is so narrow on mobile that it makes the word “Details” move into two lines. It looks good if I turn my phone landscape.
    I’m using the Full Width template of the Homepage. I have set the button alignment to all three options, None, Wide Width, and Full Width and nothing works.
    Not sure if I’m missing something.
    Thanks in advance for any help.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi there,

    Thanks for reaching out.

    I’ll help you get started with this by providing basic CSS, but if you need more help after that, our support won’t be able to help you further.

    Can you please go to Appearance > Customize > Additional CSS and add the following CSS code:

    
@media(max-width:768px){
.wp-block-buttons>.wp-block-button.wp-block-button__width-25 {
    width: 100% !important;
    padding-left: 20px;
    padding-right: 20px;
}
}

    Hope it helps!

    Best,

    Thread Starter moraima4

    (@moraima4)

    Ok got it, thank you!!

    You are welcome!

    I’ll mark this thread as resolved now. If you have any further questions, I recommend creating a new thread.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Button block on Homepage’ is closed to new replies.