problems with buttons in mobile

  • Hi, I have a problem with the buttons in this web: [ redundant link removed ]

    If you check them in PC they are fine, if you check them in phone As you can see they are not horizontal, but vertical.

    Here a screen shoot: https://freeimage.host/i/screenshot-2022-07-12-12-22-28-364-comandroidchrome.w1EQp9

    It happend the same with the columms but I got to fix it with personalized CSS like this:

    .wp-block-columns {
    display: flex;
    margin-bottom: 1.75em;
    box-sizing: border-box;
    flex-wrap: wrap!important;
    align-items: normal!important;
}

    But in this ocasion I dont know what to do.

    Can anyone help me to solve it?

    • This topic was modified 2 years, 7 months ago by josefigueroa92.
    • This topic was modified 2 years, 7 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not a Requests and Feedback topic
    • This topic was modified 2 years, 7 months ago by Jan Dembowski. Reason: Title decapped. Don't YELL

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

Viewing 2 replies - 1 through 2 (of 2 total)
  • Moderator bcworkz

    (@bcworkz)

    Try this personalized CSS:

    @media screen and (max-width: 480px) {
.wp-block-buttons>.wp-block-button.wp-block-button__width-25 {
    width: 100%;
}
}

    You may need to adjust the 480px value if the button is too wide or still too narrow at certain screen sizes.

    Thread Starter josefigueroa92

    (@josefigueroa92)

    i bcworkz,
    Thanks for your answer!

    I have tried like that with it but seems not to work.

    I tried also removing the firs line so I put only:

    .wp-block-buttons>.wp-block-button.wp-block-button__width-25 {
    width: 100%;
    }

    And I got to fix it in the pc screen(when dispaying as a phone) but when I reload on my real phone, still wrong design.

    Any other idea?

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘problems with buttons in mobile’ is closed to new replies.