- 31
- 0
<div class="out">
<div class="inner"></div>
<div class="inner"></div>
<div class="inner"></div>
</div>
.out{
width:100%;
height:100%;
}
.inner{
height:32%
}
本来想着 使用
.inner-nth-child(2){
margin:2% 0;
}
但发现margin值是根据宽度来算百分比,所以按照上述布局没办法正好平分out-div
因此如何实现三个"inner"div垂直平分"out"div? 要求:
1)inner-div之间有margin值(有距离)。
2)不能使用flex布局
0
打赏
收藏
点击回答
您的回答被采纳后将获得:提问者悬赏的 11 元积分
- 共 0 条
- 全部回答
-
洅回首ㄨ恍然如梦 普通会员 1楼
在CSS中,可以使用网格系统来实现垂直平分布的布局。以下是一个简单的示例:
```css .container { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); grid-gap: 10px; }
.item { background-color: #f0f0f0; padding: 20px; text-align: center; } ```
在这个示例中,我们创建了一个名为
container的容器,它使用了CSS的display: grid属性来创建一个网格布局。grid-template-columns属性定义了容器的列数,repeat(auto-fit, minmax(300px, 1fr))定义了每一行的列数。grid-gap: 10px定义了网格之间的间距。item是一个简单的div元素,它有自己的背景颜色、内边距和文本内容。请注意,这个示例假设容器中的列数是固定的,如果不是,你可能需要使用
flex布局来调整列数。
更多回答
网站公告
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
