title: Bootstrap modal is transparent
body: <p>I used what I've saw on a tutorial but it seems having a problem on my part coz i read other post on google but no one help on my problem.
  how can i make my modal dialog not transparent?</p>
  
  <p>here what it looks like
  <a href="http://i57.tinypic.com/20pr18w.png" rel="nofollow">http://i57.tinypic.com/20pr18w.png</a></p>
  
  <p>here's my codes</p>
  
  <pre><code>&lt;div class="container"&gt;
      &lt;div class="row text-center"&gt;
          &lt;h3&gt;Picture&lt;/h3&gt;
          &lt;a href="#" class="btn btn-lg btn-success" data-toggle="modal" data-target="#basicModal"&gt;Upload a photo&lt;/a&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="modal-backdrop modal fade" id="basicModal" style="display: none;" data-backdrop="true"&gt;
    &lt;div class="modal-dialog"&gt;
      &lt;div class="modal-content"&gt;
        &lt;div class="modal-header"&gt;
          &lt;button type="button" class="close" data-dismiss="modal" aria-hidden="true"&gt;&amp;times;&lt;/button&gt;
          &lt;h4 class="modal-title" id="myModalLabel"&gt;Update Display Picture&lt;/h4&gt;
        &lt;/div&gt;
        &lt;div class="modal-body col-xs-12"&gt;
         &lt;div class="col-xs-4"&gt;
          &lt;a href="#" class="btn btn-lg btn-success text-center" style=" margin-top:50%;width:150px; height:50px;"&gt;&lt;i class="glyphicon glyphicon-plus"&gt;&lt;/i&gt; Upload a photo&lt;/a&gt;
          &lt;/div&gt;
  
         &lt;div class="col-xs-8"&gt;
         &lt;h4 class="pull-right"&gt;PREVIEW&lt;/h4&gt;
           &lt;div class="center-block" style="background-image:url(img/default-picture.jpg);
              width: 200px;
               height: 200px;
               background-size: cover;
               display: block;
               border-radius: 100px;
               -webkit-border-radius: 100px;
               -moz-border-radius: 100px;"&gt;
           &lt;/div&gt;
         &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="modal-footer"&gt;
          &lt;br&gt;
          &lt;button type="button" class="btn btn-default" data-dismiss="modal"&gt;Close&lt;/button&gt;
          &lt;button type="button" class="btn btn-primary"&gt;Save changes&lt;/button&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  
  &lt;/div&gt;  
  </code></pre>
  
  <p>
  </p>