css 两个div并排 左边div一插入<h1>标签 右边的div就会移到下面 怎么才能不移动？？
<styletype="text/css">body{background-position:50%0px;background-color:#0CC;}li{list-...
<style type="text/css">
body {
background-position: 50% 0px;
background-color: #0CC;
}
li{list-style:none;}
#a3 {
width: 900px;
height: 550px;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
#a4 {
width: 398px;
height: 450px;
margin:0 auto;
border:1px solid #dccfac
}
#a4 ul{width:398px; height:400px;float:left; display:inline;margin:0 auto;}
#a4 ul li{width:398px; height:31px;float:left;line-height:31px; display:inline;}
#a4 ul li a{width:92px; height:31px;float:left; display:inline;font-size:15px;text-align:center;}
#a4 h1{width:92px;font-size:15px;}#a4 h2{width:92px;font-size:15px;}
#a5 {
width: 398px;
height: 450px;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
border:1px solid #dccfac
}
#a5 ul{width:398px; height:180px;float:left; display:inline;}
#a5 ul li{width:398px; height:31px;float:left;line-height:31px; display:inline;}
#a5 ul li a{width:92px; height:31px;float:left; display:inline;font-size:15px;text-align:center;}
#a5 h1 {width:92px;height:31px;font-size:15px;}
</style>
</head>
<body>
<div id="a3" style="float:left">
<div id="a4" style="float:left"><h1>经典名篇<h1><ul>
<li><a >诸子百家</a><a >曹操</a><a>曹丕</a><a >曹植</a></li>
</ul></div>
<div id="a5" style="float:left"><h1>文学家诗歌推荐<h1><ul>
<li><a >诸子百家</a><a >曹操</a><a>曹丕</a><a >曹植</a></li>
</ul></div>
</div>
</body>
</html> 展开
body {
background-position: 50% 0px;
background-color: #0CC;
}
li{list-style:none;}
#a3 {
width: 900px;
height: 550px;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
#a4 {
width: 398px;
height: 450px;
margin:0 auto;
border:1px solid #dccfac
}
#a4 ul{width:398px; height:400px;float:left; display:inline;margin:0 auto;}
#a4 ul li{width:398px; height:31px;float:left;line-height:31px; display:inline;}
#a4 ul li a{width:92px; height:31px;float:left; display:inline;font-size:15px;text-align:center;}
#a4 h1{width:92px;font-size:15px;}#a4 h2{width:92px;font-size:15px;}
#a5 {
width: 398px;
height: 450px;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
border:1px solid #dccfac
}
#a5 ul{width:398px; height:180px;float:left; display:inline;}
#a5 ul li{width:398px; height:31px;float:left;line-height:31px; display:inline;}
#a5 ul li a{width:92px; height:31px;float:left; display:inline;font-size:15px;text-align:center;}
#a5 h1 {width:92px;height:31px;font-size:15px;}
</style>
</head>
<body>
<div id="a3" style="float:left">
<div id="a4" style="float:left"><h1>经典名篇<h1><ul>
<li><a >诸子百家</a><a >曹操</a><a>曹丕</a><a >曹植</a></li>
</ul></div>
<div id="a5" style="float:left"><h1>文学家诗歌推荐<h1><ul>
<li><a >诸子百家</a><a >曹操</a><a>曹丕</a><a >曹植</a></li>
</ul></div>
</div>
</body>
</html> 展开
1个回答
展开全部
那是因为你的H1宽度超过了DIV的宽度，，它就会把第二个顶下去了，，
你用chrome审核来看那个元素就行了。
你用chrome审核来看那个元素就行了。
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
