Pique Fullscreen

• 

  manuelborgesmusic · Member · Dec 6, 2016 at 8:36 am

  • Copy link
  • Add topic to favorites

  Hey People :),

  how can I make my Site Fullscreen?

  On bigger monitors it has always a blue backround on the sites.

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

• 

  thesacredpath · Member · Dec 10, 2016 at 2:04 am

  • Copy link

  Hi there, you can give the following a try and see what you think. When we make the site full width of the browser window, we also have to adjust the image, and to keep the image full size to cover the panel background area, we have to add some addition CSS, which changes what you see of the images somewhat.

  .site {
  	max-width: 100%;
  }
  .pique-panel-background {
  	background-repeat: no-repeat;
  	background-size: 100% auto;
  }

• 

  manuelborgesmusic · Member · Dec 12, 2016 at 9:33 pm

  • Copy link

  thanks!! love it. only thing is, on smartphones its now not really cool :/

• 

  thesacredpath · Member · Dec 13, 2016 at 3:39 am

  • Copy link

  We can actually make a change. The .site div has a max-width setting of 1400px, so we can use a Media Query to apply this change to only screens wider than that. Replace what I had give before with this.

  @media screen and (min-width: 1400px) {
  .site {
  	max-width:100%;
  }
  .pique-panel-background {
  	background-repeat:no-repeat;
  	background-size:100% auto
  }
  }

• 

  manuelborgesmusic · Member · Dec 13, 2016 at 10:50 pm

  • Copy link

  Thanks so much!!!

• 

  thesacredpath · Member · Dec 14, 2016 at 2:22 am

  • Copy link

  You are welcome.