时间戳

首页 > 解决方案 > 尝试添加垂直 div 和其他内容被下推

javascript - 尝试添加垂直 div 和其他内容被下推

问题描述

我正在尝试在其他 div 之间添加垂直 div 处理程序。无论出于何种原因，其他 div 都会被推倒。我不知道为什么。

https://jsfiddle.net/paralaxwombat/dcog2pem/2/

你可以看看上面的jsfiddle和下面的代码。

编辑。我需要的是让所有 div 彼此对齐，处理程序 div 介于两者之间。

CSS

html, body {
  height: 100%;


}

.entire-col{
   display:table;
   height: 100%;
   width:100%;
   table-layout:relative;
   float: inherit;
}

标签： javascripthtmlcss

解决方案

我建议为此使用 flexbox 而不是模仿表格。在这里用 flexbox 修复它：https ://jsfiddle.net/gm2c5v8u/

.entire-col {
    display: flex;
    height: 100%;
    width:100%;
    float: inherit;
}

.col-container {
    width: 25%;
    padding: 0 0 0 0;
}

推荐阅读