title: Fancybox: 100% width -100px
body: <p>I'm currently trying to find a way to display FancyBox over the whole width of my screen with a 100px margin on the left. I tried this</p>
  
  <p><strong>jQuery</strong></p>
  
  <pre><code>$(document).ready(function() {
      $(".fancybox").fancybox({
       'width': '100%'         
   });
  });
  </code></pre>
  
  <p>and <strong>CSS</strong></p>
  
  <pre><code>.fancybox-wrap {
  position: absolute;
  left: 100px;
  }
  </code></pre>
  
  <p>Ok, this works fine, but now i have a horizontal scrollbar in my browser that is caused by the 100 percent + 100px width.</p>
  
  <p>What I'm wondering now, is there a way to get the 100 percent browser width minus 100px?
  I tried this, but it didn't work:</p>
  
  <p><strong>jQuery</strong></p>
  
  <pre><code>$(document).ready(function() {
     $(".fancybox").fancybox({
     'width': (100% - 100) + "px"      
     });
  });
  </code></pre>
  
  <p>Would be great if anyone could provide some working lines of code, I totally suck at coding. TY.</p>