Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • October 2, 2016 at 8:45 am #694290
    ShortieD

    HI team – please see screenshot here – the 2 buttons in the header slideshow are cut off on mobile

    https://www.dropbox.com/s/oo7qzlgkdq29x88/IMG_0145.PNG?dl=0

    I’ve used one of your templates so haven’t tweaked the design too much – any suggestions as to how to fix?

    here’s the site

    Welcome

    thanks

    October 3, 2016 at 6:26 am #694439
    Rikard

    Hey ShortieD,

    Please try the following in Quick CSS under Enfold–>General Styling:

    .home .avia-slideshow-button a {
font-size: 9px !important;
}

    Regards,
    Rikard

    October 3, 2016 at 10:41 am #694489
    ShortieD

    Hi There – this doesn’t do anything – I tried adding a media query as well

    @media only screen and (max-width: 989px){
    .home .avia-slideshow-button a {
    font-size: 9px !important;
    }
    }

    But neither did anything – any other suggestions – I always have issues getting buttons on your slideshow module to display properly on mobile – is it betterto increase the size of the slideshow height on mobile rather than decrease the size of the buttons?

    Cheers

    October 3, 2016 at 10:57 am #694496
    Vinay

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
    Adjust the max-width value in media query to suit your design.

    
@media only screen and (max-width: 775px) {
    #full_slider_1  {
    background:#018ec6!important;
}
.av_slideshow_full.avia-slideshow { 
    min-height: 300px!important;
}}

    Best regards,
    Vinay

    October 13, 2016 at 4:53 am #698573
    ShortieD

    excellent – that’s great! Thank you

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘buttons in header on mobile are cut off’ is closed to new replies.