Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #700572

    Hi,

    I am working on a site where I added a large header at the bottom of a color section. The header unfortunately does not resize for mobile.

    Is there a way I can make the header font responsive so it adapts to mobile screens?

    The development site is here: http://dev1.colorit.ch/biographies/

    Thanks so much
    Corina

    #701090

    Hi Corina!

    Try to add this code in your Quick CSS (under Enfold > General Styling):

    @media only screen and (max-width:767px) {
      .page-id-16 #av_section_1 h1.av-special-heading-tag {
        font-size: 32px !important;
        padding-bottom: 40px;
      }
    }

    Just change the values of font-size(size of text) and padding (positioning). Hope this helps :)
    Regards,
    Nikko

    #702244

    Awesome thanks so much Nikko. It only worked on the one page but it was the starting point I needed… all sorted.
    Thanks for your always amazing support. Appreciate it very much.
    Kindest Regards,
    Corina

    #702257

    Hi Corina,

    Glad we could help :)

    Regards,
    Nikko

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Adapt Header Size for Mobile’ is closed to new replies.