Support Center Visit Demo License manager Buy @ envato

headings out of the screen in mobile version

cvaldiviacvaldivia
in Theme support
all the headings are out off the screen in the mobile version, how we can fix this? so the entire heading is in the screen. i search for this problem in the forum but i cant find anything on this matter. i set everything responsive on responsive settigs in muffin options and the issue persist. My page is wiseconn.cl


i will really appreciate some help thanks!!image
image

Comments

  • cvaldiviacvaldivia
    also can this shortcode that i found in one of your demos also responsive?

    [google_font font="lato" size="48" weight="700" italic="0" color="#ffffff" subset=""]xxxxx[/google_font]

    thanks!!!
  • AlbertAlbert
    Hi,

    probably words are too long and that's why headings are out of the scree. To wrap headings into small screens, please use below css: 
    h1, h2, h3, h4, h5, h6 { word-wrap: break-word !important; }
    About google fonts, yes, these are responsive.
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • cvaldiviacvaldivia
    thanks that work, i also apply the fix to the google font shortcode and also work, the only thing now is that the fix break the word and that doesnt look very good, actually its look confusing when someone wants to read it, its there a way to decrease the font even more so the word doesnt break?

    Thanks in advance
  • AlbertAlbert
    If you want to decrease these headings on mobile devices, then you must use below css: 
    @media only screen and (max-width: 479px) {
        h1, h2, h3, h4, h5, h6 { font-size: 10px !important; }
    }
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • cvaldiviacvaldivia
    work nicely thanks so much
  • AlbertAlbert
    You're welcome :)
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
Sign In or Register to comment.