title: Twitter bootstrap with ASP.NET not MVC
body: <p>I have been working in ASP.NET Web Applications (not MVC) for a while at work. I really would like to use the twitter bootstrap framwork. I think it looks great and has a lot of the work already taken care of for you. I cannot seem to get it to work with ASP server controls. I know that the css is probably trying to change the asp:Button tag to an HTML tag. I just have no idea how to get these to work together. I get the following error.</p>
  
  <p>Warning 2   //file location : ASP.NET runtime error: The base class includes the field 'btnTest', but its type (System.Web.UI.HtmlControls.HtmlButton) is not compatible with the type of control (System.Web.UI.WebControls.Button).   //File location 21  1   FalconFutbolClub</p>
  
  <p>When rendering the site to debug, I get the following error:</p>
  
  <p>Control 'mainContentHolder_btnTest' of type 'Button' must be placed inside a form tag with runat=server.</p>
  
  <p>I think it would be really annoying to try to manage postbacks with javascript. I really would just like to use regular ASP server controls, hence the whole reason of using ASP.NET Web Applications. Please help.</p>
  
  <p>EDIT: Code. Here is the master page and my default.</p>
  
  <p>Master Asp:</p>
  
  <pre><code>&lt;%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs"           Inherits="FalconFutbolClub.SiteMaster" %&gt;
  
  &lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;Falcon Futbol&lt;/title&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;meta name="description" content="What's in your toybox?"&gt;
      &lt;meta name="author" content="Pure Parties"&gt;
      &lt;link rel="stylesheet" type="text/css" href="assets/css/bootstrap.css"&gt;
      &lt;link rel="stylesheet" type="text/css" href="assets/css/style.css"&gt;
      &lt;link rel="stylesheet" type="text/css" href="assets/css/bootstrap-responsive.css"&gt;
  
      &lt;link rel="shortcut icon" href="images/favicon.ico"&gt;
      &lt;link rel="apple-touch-icon" href="images/apple-touch-icon.png"&gt;
      &lt;link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png"&gt;
      &lt;link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png"&gt;
  
      &lt;style&gt;
        body {
          padding-top: 85px; /* 60px to make the container go all the way to the bottom of the topbar */
        }
      &lt;/style&gt;
      &lt;asp:ContentPlaceHolder ID="headerContentHolder" runat="server" /&gt;
    &lt;/head&gt;
  
    &lt;body&gt;
  
      &lt;div class="navbar navbar-fixed-top"&gt;
        &lt;div class="navbar-inner"&gt;
          &lt;div class="container"&gt;
            &lt;a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"&gt;
              &lt;span class="icon-bar"&gt;&lt;/span&gt;
              &lt;span class="icon-bar"&gt;&lt;/span&gt;
              &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;/a&gt;
            &lt;a class="brand" href="#"&gt;Falcon Futbol&lt;/a&gt;
            &lt;div class="nav-collapse"&gt;
              &lt;ul class="nav"&gt;
                &lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="#about"&gt;About&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="#contact"&gt;Contact&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/div&gt;&lt;!--/.nav-collapse --&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="container"&gt;
          &lt;div class="row"&gt;
              &lt;div span="12"&gt;
              &lt;asp:ContentPlaceHolder ID="mainContentHolder" runat="server" /&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  
  
  &lt;script src="assets/js/jquery.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-transition.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-alert.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-modal.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-dropdown.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-scrollspy.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-tab.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-tooltip.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-popover.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-button.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-collapse.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-carousel.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/bootstrap-typeahead.js"&gt;&lt;/script&gt;
  
  &lt;script type="text/javascript"&gt;
      $('.carousel').carousel({
          interval: 2000
      })
  &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Master C#</p>
  
  <pre><code>using System;
  using System.Collections.Generic;
  using System.Linq;
  using System.Web;
  using System.Web.UI;
  using System.Web.UI.WebControls;
  
  namespace FalconFutbolClub
  {
      public partial class SiteMaster : System.Web.UI.MasterPage
      {
          protected void Page_Load(object sender, EventArgs e)
          {
  
          }
      }
  }    
  </code></pre>
  
  <p>Default aspx:</p>
  
  
  
  <pre><code>&lt;asp:Content ID="content1" ContentPlaceHolderID="headerContentHolder" runat="server"&gt;
      &lt;script type="text/javascript"&gt;
  
      &lt;/script&gt;
  &lt;/asp:Content&gt;
  
  &lt;asp:Content ID="content2" ContentPlaceHolderID="mainContentHolder" runat="server"&gt;
      &lt;div class="container"&gt;
          &lt;header class="jumbotron subhead" id="overview"&gt;
              &lt;h1&gt;Falcon Futbol&lt;/h1&gt;
              &lt;p&gt;Event registration forms can be filled out here.&lt;/p&gt;
              &lt;asp:Label ID="clickedTest" runat="server" /&gt;
          &lt;/header&gt;
          &lt;div class="span12"&gt;
              &lt;blockquote&gt;
                  &lt;p&gt;Event registration form 1.&lt;/p&gt;
                  &lt;small&gt;March 17, 2012&lt;/small&gt;
              &lt;/blockquote&gt;
              &lt;div class="span4"&gt;
                  &lt;asp:Button id="btnTest" runat="server" onclick="btnForm1_Click" Text="test" /&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/asp:Content&gt;
  </code></pre>
  
  <p>Default C#:</p>
  
  <pre><code>using System;
  using System.Collections.Generic;
  using System.Configuration;
  using System.Data;
  using System.Linq;
  using System.Web;
  using System.Web.Security;
  using System.Web.UI;
  using System.Web.UI.WebControls;
  using System.Web.UI.WebControls.WebParts;
  using System.Web.UI.HtmlControls;
  using System.Xml.Linq;
  using System.IO;
  
  namespace FalconFutbolClub
  {
      public partial class _Default : System.Web.UI.Page
      {
          protected void Page_Load(object sender, EventArgs e)
          {
  
          }
          protected void btnForm1_Click(object sender, EventArgs e)
          {
              clickedTest.Text = "Clicked!";
          }
      }
  }
  </code></pre>