Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #31621
    J K
    Guest

    Hello,
    I am using the Grid-One theme in a Dreamhost WP install. When viewing in mobile, text that is h2 title-main is not appropriately re-sized and instead hangs over that requires a right scroll to read. The issue is most noticeable when the word is a long word, ex: “Conservation” where the entire word at the default theme h2 title-main font size does not fit in the mobile screen width and I need to scroll to see the whole world. How can I fix this? Thank you!

    #31646

    Hello,

    Thanks for contacting us – we are happy to help you adjust the font size of the h2 title-main in Grid One. Since Grid One uses a very large heading size, when using longer words we suggest using CSS Media Queries to set specific font sizes for different devices. I tested using your heading, and I found this code to work. You can copy and paste it into Customizer > Custom JS & CSS in the Custom Theme CSS section at the top of that panel:

    @media (max-width:767px) {
    h2.title-main {
    	font-size: 44px !important;
    }
    }
    @media (min-width:768px) and (max-width:1200px) {
    h2.title-main {
    	font-size: 60px !important;
    }
    }
    @media only screen and (min-width: 1200px) {
    h2.title-main {
    	font-size: 79px !important;
    }
    }

    Please let us know if this worked, or if you have any other questions.

    Thanks,
    Nicole

    #31661
    JK
    Guest

    Thank you – that worked!

Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Title-Main not responsive – text overhangs’ is closed to new replies.