这可能是个老问题。我在堆栈溢出中引用了许多链接,其中已经发布了相同的解决方案。但我找不到对我有用的东西。我已经读过overflow:visible
在与自动属性结合时充当自动。我理解这些,但我需要一个解决方案来克服这一点。任何帮助将不胜感激。
我的页面中有一组标签,我将在标签onclick
中添加一个活动类。这是一个JS的工作。不用担心我可以工作。我的问题是,overflow-y:visible
似乎隐藏了活动状态的顶部边界。我需要它可见,并确保我的X轴应该有一个滚动。鉴于我的代码如下。要记下的类是tabs.activeTab:before
<div class="outer">
<div class="tabs activeTab">
Tab1
</div>
<div class="tabs">
Tab2
</div>
<div class="tabs">
Tab3
</div>
<div class="tabs">
Tab4
</div>
<div class="tabs">
Tab4
</div>
.outer{
float: left;
width: 45%;
display: inline-block;
overflow-x: auto;
white-space: nowrap;
background:#00adfc;
overflow-y:visible;
border:1px solid #00adfc;
}
.tabs{
position:relative;
padding:5px;
text-align:center;
display:inline-block;
border-right:1px solid #fff
}
.tabs.activeTab:before{
position:absolute;
content:'';
left:0;
right:0;
top:-3px;
border-top:3px solid #fff;
}
另请参阅here
想要这样的东西[![在此输入图像描述] [1]] [1]