Html 将两个元件放置在100%带收割台的另一端
因此，css定位是一个在stackoverflow和互联网上的教程上有一百万个问题的主题。然而，我发现自己不断地回来研究这个话题，主要是因为它困扰着我，我永远也找不到解决我特定话题的方法 为了简单起见，我有一个100%宽度的div标记作为标题，如下所示Html 将两个元件放置在100%带收割台的另一端,html,css,Html,Css,因此，css定位是一个在stackoverflow和互联网上的教程上有一百万个问题的主题。然而，我发现自己不断地回来研究这个话题，主要是因为它困扰着我，我永远也找不到解决我特定话题的方法 为了简单起见，我有一个100%宽度的div标记作为标题，如下所示 <div style="width: 100%; height: 100px;"> </div> 现在，在这个div内部的屏幕左侧，我有4个链接，包装在一个容器div中。在屏幕右侧，我有两个链接，包装在一个容器di
<div style="width: 100%; height: 100px;">
</div>
<div style="width: 100%; height: 100px;">
<div style="width: 400px">
<div style="float: left; margin-left: 5px;">link1</div>
<div style="float: left; margin-left: 5px;">link2</div>
<div style="float: left; margin-left: 5px;">link3</div>
<div style="float: left; margin-left: 5px;">link4</div>
</div>
<div style="width: 200px">
<div style="float: left; margin-left: 5px;">link1</div>
<div style="float: left; margin-left: 5px;">link2</div>
</div>
</div>
链接1
链接2
链接3
链接4
链接1
链接2
在这种情况下真的没有办法解决这个问题吗？除了在container div上使用width:100%之外，还必须将最小宽度设置为600px。 否则，唯一剩下的选项是它们重叠（使用位置：绝对）或彼此降低（单独浮动）。根据浏览器的不同，它将在最小宽度处停止，或者至少右/左链接将保持不变 如果需要，还可以使用CSS媒体查询来显示/隐藏不同宽度的元素 顺便说一句，最好不要使用像这样的内联样式，这样可以让事情更灵活、更容易更新
.outer{
宽度：100%；
最小宽度：600px；
高度：100px；
背景色：#555；
}
.左链接{
宽度：400px；
位置：绝对位置；
浮动：左；
背景色：#999；
}
.右链接{
宽度：200px；
位置：相对位置；
浮动：对；
背景色：#999；
}
李{
浮动：左；
显示：内联块；
左边距：5px；
}
链接1
链接2
链接3
链接4
链接1
链接2
#包装器{
显示：flex；/*魔术开始了*/
高度：100px；
边框：3倍纯红；
}
#左{
宽度：400px；/*所需宽度。如果窗口狭窄，宽度将更小*/
边框：3件纯蓝；
}
#对{
宽度：200px；/*所需宽度。如果窗口狭窄，宽度将更小*/
左边距：自动；/*向右推*/
边框：3倍纯绿；
}
#包装器>div>div{/*不相关的样式*/
浮动：左；
左边距：5px；
}
链接1
链接2
链接3
链接4
链接1
链接2