Question

我试图在div之间创建一个均匀且可调节的差距，但我可以找到一种优雅的方式来做到这一点。谢谢你的帮助。

这是我发现的唯一方法，以创造差距，但我确信有更好的方法。

#big {
    height: 500px;
	width: 500px;
	border: 1px solid #FF0000;
	border-radius: 5px;
	margin:auto;
	position:relative;
	top:;
	right:
	left:
}
.small {
	height: 50px;
	width: 100px;
	border: 1px solid #FF0000;
	border-radius: 5px;
	background-color: #308014;
    margin:4px;
	position:relative;
	top:150px;
	left:200px;
  }

<!DOCTYPE html>
<html>
	<head>
		<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
		<title>Result</title>
	</head>
	<body>
	
		<div id="big">
		<div class="small"></div>
		<div class="small"></div>
		<div class="small"></div>
		<div class="small"></div>
	
		</div>
	</body>
</html>

Answer 1

要么你可以提供保证金底部或填充底部，但最后一个div保证金底部是没有必要的。

所以你可以试试

.small{
margin: 0 0 4px 0
}
.small:last-of-type{
   margin-bottom:0;
}

如何在元素之间创建可调节的间隙（div）

1 个答案: