两个div并排放置:第一个固定,第二个居中 [英] Two divs alongside each other: first sticked and the second centered
本文介绍了两个div并排放置:第一个固定,第二个居中的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想将两个div并排放置。第二个要居中,第一个要在第二个的左边,并要固定/固定。由于最后一个条件现有解决方案不起作用(两个div都已使用属性位置
)。我该如何解决?
I want to place two divs alongside each other. Second one to be centered and the first one to be on the left from second and to be sticked / fixed. Because of the last condition the existing solution does not work (attribute position
is already used there for both divs). How can I solve this?
推荐答案
类似这样的东西:
.container {
display: flex;
height:100%;
}
.left {
margin-left: auto;
width: 0;
display: flex;
justify-content: flex-end;
}
.centered {
margin-right:auto;
padding:5px;
background:green;
height:100%;
}
.left span {
position:fixed;
white-space: nowrap;
padding:5px;
background:red;
}
body {
height:200vh;
}
<div class='container'>
<div class='left'><span> some content</span></div>
<div class='centered'>centered</div>
</div>
这篇关于两个div并排放置:第一个固定,第二个居中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文