Adjusting height on smaller device’s header title

  • I’ve added the following code to make the header title the same height for all pages:

    .titleclass .page-header {height: 550px !important;}

    and that worked great – but the header title on smaller devices is too high and I am unable to adjust it using settings in Theme Options.

    Is there a code I could use to set the header title height for smaller devices? I would like the height to be around 200 px.

    Thanks!

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • hannah

    (@hannahritner)

    Hey,
    You can wrap your css in a media query so it only affects larger screens. Like this:

    @media (min-width: 992px) {
.titleclass .page-header {height: 550px !important;}
}

    And if you want a set height for smaller screens you can use this:

    @media (max-width: 992px) {
.titleclass .page-header {height: 200px !important;}
}

    Hope that helps!

    Hannah

Viewing 1 replies (of 1 total)
  • The topic ‘Adjusting height on smaller device’s header title’ is closed to new replies.