Change post title size

• 

  emelieherlin · Member · Aug 30, 2019 at 3:35 pm

  • Copy link
  • Add topic to favorites

  Hi!

  I want to scale down the size of the post titles on entry pages.
  As shown on http://emelieherlin.com, right now the title size is too big which results in titles being cut off. I want to keep the h1 size big on other pages where title is just one or two words (like frontpage, portfolio, contact etc).

  I am using aperitive theme. The current custom css looks like this:

  .blog h1.page-title:after {
  	content: "g" !important;
  }
  
  @media only screen and (max-width: 600px) {
  	/* For mobile phones: */
  	h1.page-title {
  		font-size: 90px !important;
  	}
  
  	
  	@media only screen and (min-width: 601px) {
  	/* For tablets: */
  	h1.page-title {
  		font-size: 150px !important;
  	}
  }
  
  @media only screen and (min-width: 768px) {
  	/* For desktop: */
  	h1.page-title {
  		font-size: 200px !important;
  	}
  }
  
  .widget+.widget {
  	position: relative;
  	margin-top: 2rem;
  }
  
  #big-search-trigger {
  	display: none;
  }

  (The reason I have already altered h1 is because it looked weird on mobile/tablets.)

  The blog I need help with is: (visible only to logged in users)

• 

  shitalmarakana · Member · Sep 1, 2019 at 1:57 pm

  • Copy link

  you can use class for particular page. for “Home” page.

  @media only screen and (min-width: 768px) {
   .home h1.page-title {
    font-size:110px !important;
   }
  }
  

• 

  emelieherlin · Member · Sep 26, 2019 at 5:14 pm

  • Copy link

  Thank you so much! I made it work and it looks just like I want now :)