Responsive Mobile Slider text

[Tess]

theme: YOGI PRO
http://www.DianeChristiansen.com

The text on my homepage slider was not showing up in mobile view, so I added the code below which made the text show up but the font size doesn’t appear to be responsive – it’s way too big for mobile view (fine on computer).

@media screen and (max-width:479px) {
.header { position:relative !important; height:auto !important; padding-bottom:0;}
.nivo-caption { width:100% !important; display:block !important; left:0 !important;}
#slider .top-bar h2 { font-size:18px !important;}
#slider .top-bar p { display:block !important; font-size:14px !important;}
.slider-main { padding-top:0 !important;}
.header .header-inner { padding:0;}
#slider .top-bar { top:8px !important;}
}

Is there a way to make the slider text responsive with mobile?

Thank You for your help!

[Forum Moderator]

Hi Tess,

Add this code in Custom CSS Box:

@media screen and (max-width:479px) {
.slide_info h2{font-size:15px !important;}
.slide_info p{font-size:12px !important;}
}

Regards,
Dave

[Author]

Posts