我有一个包含场地下拉列表和提交按钮的表单。 它们应该在同一条线上,但由于场地列表是动态的,它可能会变得太长并按下按钮。
我正在考虑为select设置max-width属性,但我不清楚这是否适用于所有浏览器。您对解决方法有什么建议吗?
<form action="http://localhost/ci-llmg/index.php/welcome/searchVenueForm" method="post" class="searchform">
<select name="venue">
<option value="0" selected="selected">Select venue...</option>
<option value="1">venue 0</option>
<option value="2">club 1</option>
<option value="3">disco 2</option>
<option value="4">future test venue</option>
</select>
<input type="submit" name="" value="Show venue!" class="submitButton" />
</form>
的CSS:
.searchform select {
max-width: 320px;
}
.searchform input.submitButton {
float: right;
}
答案 0 :(得分:8)
如果在服务器端生成场地,则可以使用服务器端脚本将其剪切为特定的最大字符数。
使用纯CSS时,我还会尝试在overflow:hidden
和select
元素上设置option
。还可以尝试在option元素上设置max-width
。当它在所有非IE中工作时,您可以使用通常的脚本为IE添加最大宽度支持。
答案 1 :(得分:0)
尝试:
fieldset select {
width: auto;
}