Question

html现有代码如何让两个DIV并排一行？

现有代码如下：
<style>
body{font-family:'微软雅黑','黑体';}
.area{float:left;clear:both;width:320px;}
.title{float:left;margin-top:10px;width:320px;height:30px;background:#fcfcfc;border-bottom:solid 1px #d6dbe1;border-top:solid 2px #458fce;padding:5px 0 0 15px;font-size:18px;color:#000;margin-bottom:1px;}
.md_b{float:left;width:160px;height:60px;text-align:center;padding-top:20px;margin:0 1px 1px 0;font-size:15px;cursor:pointer;background:#ededed;color:#454545;border-top:solid 2px #cfcfcf;}
.md_b:hover{background:#f7f1b6;border-top:solid 2px #c9a951;color:#8d5a00;}
.md_a{float:left;width:160px;height:60px;text-align:center;padding-top:20px;margin:0 1px 1px 0;font-size:15px;cursor:pointer;background:#53a3da;border-top:solid 2px #0160a6;color:#ffffff;}
.sub{border:none;font-size:18px;font-weight:bold;padding-top:-15px;}
</style>
<script>
function check(e){
e.className=e.className=='md_a'?'md_b':'md_a';
eid=e.id.split('m')[1];
$('ck'+eid).checked=$('ck'+eid).checked==true?'':'checked';
}
</script>
<div style="float:left">
<img src="home.jpg"> </div>
<div class="area" id="t2"><div class="title">a</div><div class="md_b" id="m1" onclick="check(this);">b<input type="checkbox" name="ck[]" value="1" id="ck1" style="display:none;" /></div></div>

Answer 1

首先：把这两个div写在html代码中，如下代码所示。
<div class="content">第一个div</div>

<div class="content">第二个div</div>
其次：再css样式里面对这两个div控制，让其左浮动，或者右浮动，根据自己需要调整。下面给出例子，div的高是253px，宽是280px，让其两个左浮动，这样两个div就并排在一行了。
.content {
height: 253px;
width: 280px;
float: left;
}
最后，考虑到div的布局不规整，可以用一个大的div对其加以控制，可以写成这样，这样就可以了。
<div>
<div class="content">第一个div</div>

<div class="content">第二个div</div>
</div>

Answer 2

要让两个DIV并排一行的话，可以给第一个DIV使用float:left;第二个DIV使用float:left;下面的区块清除浮动clear:both;

你代码贴的太多，看到乱，只能这么回答，希望帮助到你！

追问

"面的区块清除浮动clear:both;"

您能说的详细点吗大神？在哪里添加clear:both;?具体代码能帮我改一改吗？

Answer 3

div默认的display属性是block,在CSS里重写为inline-block,就可以了

追问

能把代码帮我改一改吗？谢谢

Answer 4

区块变为一行，把它变为内联就可以了呀

Answer 5

不知道你想把那两个div变成一排 我一般都是左浮动 下边的div清除浮动

追问

能把代码帮忙改改吗？谢谢