bootstrap html css tabs not taking up full width of screen

Question

template url http://bootsnipp.com/snippets/33Rxn

I have been trying to edit this template take up the full width of the screen but i cant get it to. I have tried commenting out all of the "width" attributes in the CSS but it is still not taking full width of browser.

Answer 1

try change 

<div class="container"> 

with

   <div class="container-fluid"> 

or change the with for class container in css

eg building a proper full container

.container-fullwidth {
  margin: 0 auto;
  width: 100%;
}

Answer 2

Add a new css rule for the container class, and edit the 75% width of the board class to be 100%, inside the css tab of the bootsnip.

.container {
  width:100%;
}
.board{
  width: 100%;
  margin: 60px auto;
  height: 500px;
  background: #fff;
 /*box-shadow: 10px 10px #ccc,-10px 20px #ddd;*/
}

Answer 3

Changes the class of first div to container-fluid and set the width inside the board class to 100%

<div class="container"> to <div class="container-fluid">
.board { width: 75%; } to .board { width: 100%; }