CSS overflow-y:visible,overflow-x:scroll

前端之家收集整理的这篇文章主要介绍了CSS overflow-y:visible,overflow-x:scroll前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我在我的搜索中看到了这样的一些问题,但是这个问题没有得到正确回答或没有给出答案。所以,我会再问。
<style>
.parent { overflow-y:scroll; overflow-x:visible; width:100px; }
.child { position:relative; }
.child-menu { position:absolute; top:0px; left:-100px; display:inline-block; }
</style>

  <div class="parent">
  <!-- Lots of the following divs -->
  <div class="child">
    Text Line
    <div class="child-menu">some pop out stuff</div>
  </div>
</div>

好的,这只是一个例子。但基本上,我想要完成的是.child类可以在y轴上滚动…上下滚动。但我想要x轴…子菜单在.parent容器外部可见。

那有意义吗?所以发生的是,当页面呈现时,浏览器将溢出解释为自动完全,不尊重单独的轴。我做错了什么或浏览器只是不符合CSS3规范呢?大部分只在Chrome上测试。

解决方法

我想到了!

父应该溢出:auto;
.child应该是position:relative;
.child菜单应该是position:fixed;无顶部或左定位。
如果你这样做,它会保持它内联的内容

如果你需要移动子菜单使用边距,而不是顶部或左边。示例margin-left:-100px;

猜你在找的CSS相关文章