Question

我试图让多个div并排坐在＆＃34;溢出：隐藏＆＃34;家长。每个子div必须使用父组件的100％宽度。这是为了模拟＆＃34;刷卡＆＃34;在每个孩子之间。

一个解释我的问题的方法： https://jsfiddle.net/f83qeoxc/3/

<div class="wrapper">
    <div id="i1" class="item">
      item 1
    </div>
    <div id="i2" class="item">
      item 2
    </div>
    <div id="i3" class="item">
      item 3
    </div>
</div>

.wrapper{
  width: 200px;
  display: block;
  border: 1px solid black;
  overflow-x: hidden;
}

.item{

  display: ineline-block;
  float: left;
  width: 100%;
  border: 1px solid red;
  box-sizing: border-box;
}

StackOverflow已经有很多关于此类问题的材料。但是，我无法找到涵盖以下细节的解决方案：

儿童可能没有绝对定位，因为父母必须根据其内容高度调整大小。
因为每个孩子的宽度都是100％，所以只有一个孩子必须出现，其他孩子则被父母隐藏。 overflow-x property

感谢您提出解决此问题的建议！

Answer 1

更改css

set values {123 456 789}
set activeItem [lindex $values [$listbox curselection]]

https://jsfiddle.net/f83qeoxc/10/

DIV应该在溢出中保持并排：隐藏的父级

1 个答案: