Centering site tiltle on one line

• 

  olivierguiberteau · Member · Mar 1, 2015 at 6:13 pm

  • Copy link
  • Add topic to favorites

  Hi

  Having a few problems with this. Trying to enlarge my site title, have it all on one line, and center it. I can’t seem to get all three right.

  I am currently using this…

  #site-header .site-title a{font-size:10px;padding-left:px}.wf-active #site-header h2.site-description{font-size:15px}.entry-author{display:none}

  Any help greatly appreciated.

  Thanks

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

• 

  staff-happychia · Staff · Mar 2, 2015 at 8:02 am

  • Copy link

  Let’s try this CSS:

  #site-header {
  	width: 100%;
  	float: none;
  	margin: 0 auto;
      text-align: center;
  }
  
  #site-header .site-title a {
      font-size: 40px;
  }
  
  .entry-author{
  display:none
  }

• 

  olivierguiberteau · Member · Mar 2, 2015 at 10:23 am

  • Copy link

  Hi. That’s great except for one things. When I try to enlarge the text it pushes the title down into two lines. I really want it large, and all kept on the same line if possible?

  Thanks

• 

  staff-happychia · Staff · Mar 3, 2015 at 10:47 am

  • Copy link

  Replace your existing CSS with the following an see if you like the result:

  @media screen and (min-width:1300px) {
  #site-header {
     width: 100%;
     padding-left: 250px;
  }
  
  #site-header .site-title a {
      font-size: 70px;
      white-space:nowrap;
  }
  }
  
  .entry-author {
      display: none
  }

  Except hiding author names, rest of the CSS applies only for screens larger than 1300px. So on mobiles and tablets the theme default CSS applies.

• 

  olivierguiberteau · Member · Mar 4, 2015 at 1:50 pm

  • Copy link

  Perfect, Thanks for your help!