问题描述
我有两个浮动在两侧(左右)的 div 元素。我在关闭第一个 div 标签(向左浮动)和打开下一个 div 标签(向右浮动)之前应用了 hr 标签。但 hr 标签显示在顶部背景。要查看 hr 标签,请查看两个 div 之间的小连接线(在顶部)。
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
.leftmovie {
border: solid;
float: left;
width: 47%;
margin-left: 2em;
height: 400px;
}
.rightmovie {
border:solid;
float: right;
width: 47%;
margin-right:2em;
height:400px;
}
</style>
</head>
<body>
<div class="Row">
<div class="leftmovie">
<span class="Star">ergjkh<br>kdjnkj</span>
</div>
<div class="rightmovie">legnlejgn<br>gegerge</div>
</div>
<hr>
<div class="Row">
<div class="leftmovie">
<span class="Star">ergjkh<br>kdjnkj</span>
</div>
<div class="rightmovie">legnlejgn<br>gegerge</div>
</div>
</body>
</html>
解决方法
因为您在应用 clear: both
属性后不使用 float
。
将此添加到 hr
标签中。
hr {
display: inline-block;
width: 100%;
}