0

有一个带有溢出的“容器”：自动包含浮动元素组，“值”。在“value”内部，有一个绝对定位元素“popup”，它被溢出截断。我怎样才能让“弹出”出现并仍然保持“容器”不丢失其布局？

HTML

<div class="container">
  <div class="group">
    <span class="label">Label</span>
    <span class="value">
      <span class="popup_container">
        <div class="popup">Popup</div>
      </span>
    </span>
  </div>
  <div class="group">
    <span class="label">Label</span>
    <span class="value">
      <span class="popup_container">
        <div class="popup">Popup</div>
      </span>
    </span>
  </div>
</div>

CSS

.container {
    overflow: auto;
    background-color: red;
}
.label {
    float: left;
    clear: left;
    width: 100px;
}
.value {
    float: left;
}
.popup_container {
    position: relative;
}
.popup {
    position: absolute;
    height: 200px;
    width: 200px;
    background-color: orange;
}

请参阅http://jsfiddle.net/KA7AB/2/

谢谢

4

1 回答 1

2

将您的 popup_container 设置为绝对：

position: absolute;

http://jsfiddle.net/KA7AB/6/

于 2013-02-11T22:20:03.280 回答