Widening menu title header across the full width of pages

• 

  cedricfonvilleyahoocom · Member · May 29, 2017 at 1:17 am

  • Copy link
  • Add topic to favorites

  I need help getting my menu title header to stretch all the way across the pages (i.e. home, about, contact, etc). Apparently my current theme does not have a quick/easy way to do this according to the chat personnel.

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

• 

  thesacredpath · Member · May 30, 2017 at 12:59 am

  • Copy link

  You know, this is a bit of a challenge. There are three breakpoints in the design of Olsen, 992px and wider, 768px to 991px, and 576px to 767px. If we allow the header area to go full width above 992px, things start to look a little strange on wider monitors such as on my desktop at over about 1500px wide. See what you think with the following.

  @media screen and (min-width: 768px) {
  #masthead {
  	width: 100%;
  }
  #page .container {
  	width: 100%;
  }
  .featured-posts-wrapper, .site-content, .site-footer {
  	width: 100%;
  	max-width: 750px;
  	margin-left: auto;
  	margin-right: auto;
  }
  }
  @media screen and (min-width: 992px) {
  #masthead {
  	width: 100%;
  	max-width: 100%;
  }
  #page .container {
  	width: 100%;
  }
  .featured-posts-wrapper, .site-content, .site-footer {
  	width: 100%;
  	max-width: 1040px;
  	margin-left: auto;
  	margin-right: auto;
  }
  .featured-post img {
  	width: 100%;
  }
  }