title: Using Twitter Bootstrap in ASP.NET project
body: <p>I am trying to write my first ASP.NET website and I really want to use the Twitter Bootstrap but I'm failing at the first hurdle.</p>
  
  <p>I downloaded the Zip file from <a href="http://twitter.github.com/bootstrap/" rel="noreferrer">here</a>, unzipped it and added the files to my solution and the following lines to my _LAyout.cshtml file:</p>
  
  <pre><code>&lt;link href="@Url.Content("~/Context/bootstrap.css")" rel="stylesheet" type="text/css" /&gt;
  &lt;link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" /&gt;
  &lt;script src="@Url.Content("~/Scripts/bootstrap.js")" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="@Url.Content("~/Scripts/bootstrap-min.js")" type="text/javascript"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>Here is a screenshot showing the above files in my solution:</p>
  
  <p><img src="https://i.stack.imgur.com/7zghF.png" alt="CSS files">
  <img src="https://i.stack.imgur.com/bb5VH.png" alt="Scripts"></p>
  
  <p>I am trying to create a menu bar across the top with this code which was taken from <a href="http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/stepping-out-with-bootstrap-from-twitter/" rel="noreferrer">this turorial</a></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8" /&gt;
      &lt;title&gt;@ViewBag.Title&lt;/title&gt;
      &lt;script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"&gt;&lt;/script&gt;
      &lt;link href="@Url.Content("~/Context/bootstrap.css")" rel="stylesheet" type="text/css" /&gt;
      &lt;link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" /&gt;
      &lt;script src="@Url.Content("~/Scripts/bootstrap.js")" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="@Url.Content("~/Scripts/bootstrap-min.js")" type="text/javascript"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div class="topbar"&gt;
          &lt;div class="fill"&gt;
              &lt;div class="container"&gt;
                  &lt;h3&gt;Present Ideas&lt;/h3&gt;
                  &lt;ul&gt;
                      &lt;li&gt;Blog&lt;/li&gt;
                      &lt;li&gt;About&lt;/li&gt;
                      &lt;li&gt;Help&lt;/li&gt;
                  &lt;/ul&gt;
                  &lt;ul class="nav secondary-nav"&gt;
                      &lt;li class="menu"&gt;
                          &lt;a href="#" class="menu"&gt;Account Settings&lt;/a&gt;
                          &lt;ul class="menu-dropdown"&gt;
                              &lt;li&gt;Login&lt;/li&gt;
                              &lt;li&gt;Register&lt;/li&gt;
                              &lt;li class="divider"&gt;&lt;/li&gt;
                              &lt;li&gt;Logout&lt;/li&gt;
                          &lt;/ul&gt;
                      &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="container-fluid"&gt;
              @RenderBody()
          &lt;/div&gt;
          &lt;footer&gt;
          &lt;/footer&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>What I get, instead of the horizontal bar is this:</p>
  
  <p><img src="https://i.stack.imgur.com/KcOEe.png" alt="Result - vertical bar instead of horizontal"></p>
  
  <p>I would appreciate any help to get me started with what promises to be, an excellent framework.</p>