html - 不相等的 Html 文本框和下拉宽度与 XHTML 1.0 strict

标签 html css

我试图让两个输入(一个文本框,一个下拉列表)具有相同的宽度。 可以通过css设置宽度,但是由于某些原因,选择框总是小了几个像素。 似乎这只发生在 xhtml 1.0 strict 文档类型中 关于原因/解决方法的任何建议/想法?

具有以下 HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
    <style>
        .searchInput{
            width: 1000px;
            overflow: hidden;
        }
    </style>
</head>
<body>
    <form action="theAction" method="post" class="searchForm" >
        <fieldset>
            <legend>Search</legend>            
            <p>
                <!--<label for="name">Product name</label>-->
                <input class="searchInput" type="text" name="name" id="name" value="" />
            </p>
            <p>
                <!--<label for="ml2">Product Group</label>-->
                <select class="searchInput" name="ml2" id="ml2">
                    <option value="158">INDUSTRIAL PRIMERS/FILLERS</option>
                    <option value="168">CV CLEAR COATS</option>
                    <option value="171">CV PRIMERS/FILLERS</option>
                    <option value="" selected="selected">All</option>
                </select>
            </p>
            <input type="submit"  class="search"  value="Show"  name="Show"  id="Show"  />
            <input type="reset" value="Reset" name="reset" id="reset" class="reset"/>
        </fieldset>
    </form>
</body
</html>

最佳答案

您可以尝试重置边距、填充和边框,看看是否有帮助:

.searchInput {
    margin:0;
    padding:0;
    border-width:1px;
    width:1000px;
}

关于html - 不相等的 Html 文本框和下拉宽度与 XHTML 1.0 strict,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/161915/

相关文章:

javascript - HTML 段落没有变成一条直线

html - 使用 xpaths 进行 HTML 抓取有什么特别需要考虑的吗?

javascript - 下拉菜单项行为

html - 在标题处停止的框周围创建边框

javascript - 使用 JavaScript 导航栏定位

html - 垂直菜单奇怪的填充

javascript - 如何创建一个 pinterest 风格的布局,但元素具有不同的宽度,相同的高度

ios - 在 iOS 后台模式下继续从 html5 播放器播放音频

javascript - 在一定时间后通过单击 div 外部或鼠标移出来隐藏菜单?

css - 广告和媒体设备