Reducing size page title for small screens

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hello!

    Your CSS selector seems to be targeting h2 header tags, while the page titles are h1 tags. So try this instead:

    /* Change Page h1 Titles */
@media (max-width:400px) {
h1.page-title {
    font-size: 16px;
    }
}
    Thread Starter francesnt

    (@francesnt)

    Thanks for your answer. That doesn’t seem to have changed anything? Or maybe I’m putting it in the wrong place?

    Text Domain: theme55766
    Template: cherryframework4
    */

    /* =Theme customization starts here
    ————————————————————– */

    /* Change Page h1 Titles */
    @media (max-width:400px) {
    h1.page-title {
    font-size: 16px;
    }
    }

    All right.

    I always forget to mention that you should purge/clear any caching system you may be using, and refresh your browser on the device you’re viewing the page from and then check again. That often does the trick.

    If that still doesn’t change things, let me know if this works:

    /* Change Page h1 Titles */
@media (max-width: 400px) {
	h1.page-title {
		font-size: 16px !important;
	}
}

    After trying this one (and anytime you make CSS changes), also purge/clear caches and refresh browser.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Reducing size page title for small screens’ is closed to new replies.