css中如何让两个div同一行显示？设置了float还是不好使啊

Question

这是父div
.zhuomian{
height:80px;
width:210px;
float:left;}
下面的是两个子div
.1{
float:left;
width:80px;
height:80px;
}
.2{
float:left;
width:120px;
height:80px;
}

这是html的代码：
<div class="zhuomian">
<div class="1"><img src="1.jpg" /></div>
<div class="2"><p>桌面</p><p>XXXXXXX<br />XXXX！</p>
<input type="button" value="下载" class="but" /></div>
</div>

Answer 1

这是因为你的class选择器为数字的原因，将数字改为字母就生效了。在web规范里面不能使用数字开头的选择器。

.a1{
float:left;
width:80px;
height:80px;
}
.a2{
float:left;
width:120px;
height:80px;
}
这是html的代码：
<div class="zhuomian">
<div class="a1"><img src="1.jpg" /></div>
<div class="a2"><p>桌面</p><p>XXXXXXX<br />XXXX！</p>
<input type="button" value="下载" class="but" /></div>
</div>

Answer 2

Vue实践-CSS样式position/display/float属性对比使用