lara michaels lara michaels - 2 years ago 351
HTML Question

bootstrap cover template: where to place image?

This is a complete newbie question, but:

Using Bootstrap's cover template, how/where should I insert the background image to cover the page?

What I am I missing? I have tried inserting the inside the following elements in the template

<div class="site-wrapper-inner">
<div class="cover-container">
<div class="inner cover">

the image is shown but not sized to fill the viewport's dimensions.

(Or am I misunderstanding the purpose of this template?)

Answer Source

Based on where the background image is applied, it looks like the background is applied to the body tag. In which case apply this CSS:

body { 
  background: url(images/bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

"cover" causes the background to fill the block element.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download