Question

每当我移除柔性显示器时，它都会消失。无法理解那里发生了什么。经历过上下来源，但似乎没有任何元素在那里延伸。

html of it

<div class="newheadwrap">
<div class="newlogo newhead">with contents</div>
<div class="newtagline newhead" >with contents</div>
<div class="mainhead newhead">with contents</div>
</div>

和css

.newheadwrap {
-o-display:flex;
-webkit-display:flex;
-ms-display:flex;
-moz-display:flex;
display:flex;  
flex-direction:row;
width:966px;
margin:0 auto;
}
.newlogo {
width:17%;
padding-top:43px;
}
.newtagline {
width:33%;  
color:white;
padding-top:93px;
font-family: berkeleyFont;
font-size:16px;
float:right !important;
}
.mainhead {
width:50%;
}

我知道不建议在这里发布实时链接，但在这种情况下小提琴不会这样做，所以这里是一个链接 https://aps-direct.myshopify.com

Answer 1

删除当前页面右侧的额外填充的一种方法：

将overflow: hidden;添加到.newheadwrap

.newheadwrap {
-o-display: flex;
-webkit-display: flex;
-ms-display: flex;
-moz-display: flex;
display: flex;
flex-direction: row;
width: 966px;
margin: 0 auto;
overflow: hidden;
}

因此有额外的空间：

.span9 {
width: 717px;
}

减小宽度，适合

Flexbox在页面右侧创建空白区域

1 个答案: