Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • August 17, 2022 at 4:56 am #1361893
    navindesigns

    on my site – https://hardwoodbrothers.com/ – I have 4 buttons on my full width slider – I did this by adding 4 button shortcodes in the caption section

    They look good on desktop but I want to make the size of the buttons on mobile much smaller

    How do I go about doing this? the buttons are using the enfold large button class but I only want the size to change on this slider (not sitewide)

    August 18, 2022 at 4:21 am #1362024
    Ismael

    Hey navindesigns,

    Thank you for the inquiry.

    You can use this css code to adjust the size of the buttons on smaller screens.

    @media only screen and (max-width: 767px) {

  /* Add your Mobile Styles here */
  .responsive #top .av-kw1jnirn-7aeec02aee509ff49f6cdea556f5817f__0 .avia-button {
    font-size: 13px;
    padding: 8px 18px 6px;
  }
}

    We used the unique identifier (uid) of the slider as a selector so the css rule above should only change the size of the buttons within that slider.

    Best regards,
    Ismael

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