在IE8中，chrome下拉列表的宽度与下拉框的宽度相同，而在IE9中，下拉列表的宽度不同。如何固定？

Question

 .inpTxtE
 {
  font: 11px verdana;
  background-color:#FFFFFF;
  border-right: #7F9DB9 1px solid;
  border-top: #7F9DB9 1px solid;
  border-left: #7F9DB9 1px solid;
  border-bottom: #7F9DB9 1px solid;
  width:70%;
}

但是当宽度设置为72％时与IE9中的其他宽度相同。但是当它在chrome中打开时，其下拉宽度大于其他文本框。

  <asp:DropDownList ID="ddlStatus" runat="server" CssClass="inpTxtE" >
                                    </asp:DropDownList>

这是我使用的代码。我将如何解决此问题？

Answer 1

    <!DOCTYPE html>
    <html>
        <head>
            <style type="text/css">
                    input, select {
                        width: 200px;
                        border: 1px solid #000;
                        padding: 0;
                        margin: 0;
                        height: 22px;
                        -moz-box-sizing: border-box;
                        -webkit-box-sizing: border-box;
                        box-sizing: border-box;
                    }
                    input {
                        text-indent: 4px;
                    }
            </style>
        </head>
        <body>
            <input type="text" value="ABC"><br>
            <select>
                <option>1234567</option>
                <option>121212121212121</option>
                <option>12121212121212121212</option>
            </select>
        </body>
    </html>

Answer 2

 <!DOCTYPE html>
<html>
    <head>
  <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7;IE=10; IE=9;" />
        <style type="text/css">
                input, select {
                    -moz-box-sizing: border-box;
                    -webkit-box-sizing: border-box;
                    box-sizing: border-box;
                }
        </style>
    </head>
    <body>
        <input type="text" value="ABC"><br>
        <select>
            <option>1234567</option>
            <option>121212121212121</option>
            <option>12121212121212121212</option>
        </select>
    </body>
</html>