title: Where should I bootstraperize my web site?
body: <p>I want my site to be fluid/responsive to whatever device the user has; I reckon more often than not it will be a cell "phone," but I am developing on a laptop, so there's a mismatch between what I see at design time and what most users will see. Of course, I can run emulators/simulators, etc. But my point is that I want the site to automatically adjust to the size/aspect ratio/orientation the device at any given moment. From what I've read, the easiest way to accomplish this is to leverage Twitter Bootstraps capabilities by referencing their CSS file and adding a few class declarations to various tags in my html. I'm wondering just where I need to add these.</p>
  
  <p>I've added the bootstrap css:</p>
  
  <pre><code>&lt;link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.no-icons.min.css" rel="stylesheet"&gt;
  </code></pre>
  
  <p>My _SiteLayout.cshtml (Razor 2 webiste) file came structured this way (showing just the body, head decapitated):</p>
  
  <pre><code>&lt;body&gt;
      &lt;div id="fb-root"&gt;&lt;/div&gt;
      &lt;header&gt;
          &lt;div class="content-wrapper"&gt;
              &lt;div class="float-left"&gt;
                  &lt;p class="site-title"&gt;
                  &lt;/p&gt;
              &lt;/div&gt;
              &lt;div class="float-right"&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/header&gt;
      &lt;div id="body" &gt;
          @RenderSection("featured", required: false)
          &lt;section class="content-wrapper main-content clear-fix"&gt;
              @RenderBody()
          &lt;/section&gt;
      &lt;/div&gt;
      &lt;footer&gt;
          &lt;div class="content-wrapper"&gt;
              &lt;div class="float-left"&gt;
                  &lt;p&gt;
                  &lt;/p&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/footer&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>So it uses "content-wrapper" on the outher divs and then floats inner tags left and right. Does this obviate the need for Twitter Bootstrap? Is the same sort of responsive design baked into this Razor 2 structure already?</p>
  
  <p>If not, in which tags should I put the Twitter Bootstrap class declarations? </p>
  
  <p>Should I add class="row-fluid" to some of these tags and, if so, which ones?</p>