title: CSS form ie7 bug with margin left and float
body: <p>This css code has troubles for ie7. In ie6 is a total absolute mess.<br>
  The problem is that the input textbox gets bellow label.<img src="https://i.stack.imgur.com/045uh.png" alt="enter image description here">
  Only work around is to float the div left but has problems then with sizing..      </p>
  
  <pre><code>fieldset.label_side &gt; label {
      width: 100px;
      position: relative;
      float: left;
      left: 0;
      padding: 18px 20px 8px;
      border-right: 1px solid #eee;
      clear: left;
      line-height: normal;
  }
  fieldset label{
          font-size: 13px;
      font-weight: bold;
      padding: 15px 20px 10px;
      margin-right: 10px;
      display: inline-block;
      color: #333;
  }
  
  fieldset.label_side &gt; div {
      width: auto;
      margin-left: 140px;
      padding: 15px 20px;
      border-left: 1px solid #eee;
      clear: right;
        display: block;
  }
  
  .box-block fieldset input{    
      -webkit-border-radius: 2px;
      -moz-border-radius: 2px;
      border-radius: 2px;
  }
  
  input.text{
      width: 100% !important;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      border : solid #eee 1px;
      background-color: #fbfbfb;
      line-height: 32px;
     display: inline;
      height: 32px;
      padding: 0px 0 0 5px;
  
  }
  </code></pre>
  
  <p><strong>UPDATE</strong></p>
  
  <p>I found that the problem is because of the input width 100%.. I am looking how to fix it.</p>