title: Input element not aligning "flush" to DIV container
body: <p>I have been laying out a GUI uing ASP.NET and find I am confused by the rendering of the <code>&lt;asp:TextBox /&gt;</code> control. It seems as though some default margin is added to the left and right of the  <code>&lt;input&gt;</code> control that is rendered by the ASP.NET TextBox. Below is an example of my code. The resultant <code>&lt;input&gt;</code> element does not align flush to the container <code>&lt;div&gt;</code>, even thought the text element above it ("Some Text") is aligned flush.</p>
  
  <pre><code>&lt;div style="float:left;"&gt;
    &lt;b&gt;Some Text&lt;/b&gt;
    &lt;asp:TextBox ID="txtTextBox" runat="server" TextMode="MultiLine" Style="width:300px;height:300px;"  /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Quite by accident I found that if I first added a <code>&lt;p /&gt;</code> element as the first element in the <code>&lt;div&gt;</code> that the <code>&lt;input&gt;</code> element would align flush. Here is an example ...</p>
  
  <pre><code>&lt;div style="float:left;"&gt;
    &lt;p /&gt;
    &lt;b&gt;Some Text&lt;/b&gt;
    &lt;asp:TextBox ID="txtTextBox" runat="server" TextMode="MultiLine" Style="width:300px;height:300px;"  /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Does anyone know why this is? Why does the <code>&lt;input&gt;</code> element not align flush to the <code>&lt;div&gt;</code>, yet when adding a <code>&lt;p /&gt;</code> do the <code>&lt;div&gt;</code> it does?</p>
  
  <p>UPDATE - I found the issue was Internet Explorer compatibility mode. It was enabled and therefore not following the CSS rules. After disabling compatibility mode the textbox lined up properly. Thanks for all the answers. They were ALL great and helped me track down the problem. +1 to all. I answered the post so as to make it easier for future readers to find the answer.</p>