多个DIV横排 div之间的间距一样

醉清颜 赣州朝饮网络传媒有限公司 技术支持/维护工程师  2017-05-17 06:49:21
在一个div放很多的div,就是横排,比如每排5个,我想请教的是如何设置每个div之间的间距一样,而且每排的第1个div距离外层div左边的距离与每排的第5个div距离外层div右边0px,要兼容主流浏览器啊?一直没有找到设置的好办法。谢谢了
...全文
1179 5 打赏 收藏 举报
写回复
5 条回复
切换为时间正序
当前发帖距今超过3年,不再开放新的回复
发表回复
辰洛 2017-05-31
可以使用js来实现 var n = $("div").size() //设置浮动的div的数目 for (var i = 1; i < n; i++) { $("div").eq(4*i-1).css({ //4代表每行显示的数目,从0开始计数 "margin-right":"0", }) };
  • 打赏
  • 举报
回复
话说有点呆 2017-05-31
支持一下2楼
  • 打赏
  • 举报
回复
34818060 2017-05-29
除了flex外;也可以设置inline-block或浮动来实现
  • 打赏
  • 举报
回复
沐沐坏小孩 2017-05-19
楼上正解,建议楼主好好学学选择器
  • 打赏
  • 举报
回复
天际的海浪 2017-05-17

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<title> 页面名称 </title>
<style type="text/css">
#box {
	background-color: #999;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	height: 100%;
}
#box div {
	border: 1px solid #f09;
	background-color: #ff9;
	width: 18%;
	height: 60px;
}
</style>
</head>
<body>
<div id="box">
	<div>1</div>
	<div>2</div>
	<div>3</div>
	<div>4</div>
	<div>5</div>
	<div>6</div>
	<div>7</div>
	<div>8</div>
	<div>9</div>
	<div>10</div>
	<div>11</div>
	<div>12</div>
	<div>13</div>
	<div>14</div>
	<div>15</div>
</div>
</body>
</html>
  • 打赏
  • 举报
回复
相关推荐
发帖
CSS
加入

6.0w+

社区成员

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
申请成为版主
帖子事件
创建了帖子
2017-05-17 06:49
社区公告
暂无公告