溢出问题

时间:2011-07-20 10:52:30

标签: html css html5

我有以下标记,

    <section class="top">
        <article class="the-team">
            <section>
            <img width="106" height="113" title="key-staff-tim" alt="key-staff-tim" class="attachment-post-thumbnail wp-post-image" src="test.jpg">             
               <section class="biography">
               <h3>name &ndash; position</h3>
               <p>Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content</p>
<p>Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content</p>
            </section>
     </section>
</article>
</section>

我有以下CSS,

.the-team {
  width: 443px;
  float: left;
  overflow: hidden;
  position: relative; }
  .the-team .biography {
    width: 313px;
    position: absolute;
    top: 0px;
    left: 124px; }
    .the-team .biography p {
      margin: 0px 0px 10px 0px; }

然而我的溢出被隐藏在包含所有内容的部分中,当它不应该时,我怎么能阻止这个/

2 个答案:

答案 0 :(得分:0)

只要您完全定位内容,就会将其从父元素的流中移除。这导致父母在计算它的高度时不使用它。由于设置为不显示溢出,因此其外部的所有内容都将被剪掉。你有完全定位内容的具体原因吗?

答案 1 :(得分:0)

您正在测试此浏览器。我在我的Firefox上检查了它,它工作正常。溢出属性工作正常。