我有一个html如下:
<li class="liClass">
<img class="dragingClass" />
<img class="removeClass" />
<label for="shoe" class="ShoeClass">
<select class="width_150">
<option>blackShoe</option>
<option>greenShoe</option>
<option>redShoe</option>
</select>
<label for="price" class="priceLabelClass">foo1</label>
<input type =""text" style="width:3em" class="priceInputClass" value="" />
<label for="minSize" class="minSizelabelClass">
<input style="width:4em" class="minSizeInputClass" value="" />
我的Css:
.liClass {
clear: left;
padding: 5px 0;
}
li.pushedProduct img.dragingClass{
float: left;
cursor: move;
}
li.pushedProduct img.removeClass{
float: left;
padding-left:4px;
}
.liClass label {
float: left;
padding: 0.1em 1em 0 1em;
width: 5em;
text-align: right;
}
label.ShoeClass {
float: left;
width: 2em;
}
label.priceLabelClass {
float: left;
width: 3em;
}
label.minSizelabelClass{
float:left;
width: 3.5em;
}
.liClass input {
float: left;
width: 15em;
}
.liClass select {
display: inline;
float: left;
width: 150px;
}
以上css在Firefox中工作正常,但在IE9中,标签位于所有输入框的下方。我无法弄清楚出了什么问题。
答案 0 :(得分:0)
我同意Stack 101:html有点未完成,似乎是大部分问题。正如已经指出的那样,将type =""text"
更改为type="text"
并为鞋子添加缺少的</label>
以及代码末尾的结尾</li>
。我调整了这个例子中的所有html,并自行纠正:http://jsfiddle.net/GVBJW/
我不认为这是你的CSS ...只是格式错误的HTML。