• Resolved fpaz

    (@fpaz)


    Hi, I’m using the i-max template for my website http://www.kreziesounds.com
    I would like to know if there’s a way to use a different font size for the text in the slider on tablet resolutions. It seems that the pictures in the slider are resized to fit the screen, but the fontsizes don’t. This way a text and the button in the slider on a computer screen looks fine, but will be cutoff on a mobile device. I couldn’t find a solution in the CSS so far.

Viewing 7 replies - 1 through 7 (of 7 total)
  • Hi, let me check it

    Try this CSS

    @media only screen and (max-width:939px) {
    .slider-content-wrap h2 {
    	font-size:20px !important;
    }
    }
    Thread Starter fpaz

    (@fpaz)

    Hi, thanks for the input 🙂
    I added your CSS code to the “additional style” field in the theme, but it doesn’t work… No difference.

    Hi, i checked , the CSS is not there in site. again try to save the CSS in theme.

    Thread Starter fpaz

    (@fpaz)

    No, I removed the code after testing it. I just tested it again with the code added in the CSS, but the slider text doesn’t behave differently.

    I took a closer look with the Responsive design testing option in the Firefox development tools. What I see is that the text does scale somewhat, but not enough. What happens is that the image scales fluidly, and with shrinking the screen to for instance a tablet resolution the text does scale a bit, but still dissappears out of the visible area of the slider.

    I just added some text in the first slide on my live homepage. When you look at it on a computer screen it is fine. On a tablet it’s visible for a part.

    Thread Starter fpaz

    (@fpaz)

    I have been testing somewhat more with the provided CSS code, and it seems that it offers a solution. I added the provided CSS code twice:
    a line for the h2 text, and a line for the normal text. This way the site responds better to tablet screen sizes. I think I need to add some tweaks here and there, but it’s certainly better now.

    Thank you very much “Softound Solutions”!

    Thread Starter fpaz

    (@fpaz)

    For other users of the theme. This is what I added in the CSS:

    @media only screen and (max-width:939px) {
    .slider-content-wrap h2 {
    	font-size:16px !important;
    }
    }
    
    @media only screen and (max-width:939px) {
    .slider-content-wrap {
    	font-size:9px !important;
    }
    }
Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Slider font sizes’ is closed to new replies.