Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • March 15, 2023 at 8:51 pm #1401315
    Sandy

    A web page has a Promo Box with text and a button. They look great on desktop, with the text aligned left and the button aligned right. But on mobile the left aligned text looks odd with the centred button.

    How can the text be centred only on mobile, i.e., when the button becomes full width centred?

    March 16, 2023 at 4:58 am #1401336
    Ismael

    Hey Tanja,

    Thank you for the inquiry.

    You can use this css code to center align the promobox content on mobile view.

    @media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */
  .avia-promocontent {
    text-align: center;
  }
}

    If you need to apply a margin below the content to create some space, please use this instead.

    @media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */
  .responsive .avia-promocontent {
    text-align: center;
    margin-bottom: 20px;
  }
}

    Best regards,
    Ismael

    March 16, 2023 at 2:53 pm #1401380
    Sandy

    This is perfect, thank you!

    March 17, 2023 at 5:26 am #1401483
    Ismael

    Hi,

    Glad to know that this is working! Please feel free to open another thread if you have more questions.

    Have a nice day.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Center Promo Box text on mobile’ is closed to new replies.