创建一个扩展为包含一个块的div,但让另一个块流到它之外

[英]Create a div that expands to contain one block, but let's another block flow outside it


CSS still always catches me...

CSS总是抓住我......

I want to have a block that automatically expands to contain some child content, but let's another child flow out of it. That is:

我希望有一个块自动扩展以包含一些子内容,但让另一个孩子流出它。那是:

<div class='no-expansion-from-big-child'>
  <p>This is a block with content, and a child div.</p>
  <div class='big-child'>
    <p>This is a child-block - I want it to overflow outside the borders of its containing div.</p>
  </div>
</div>

So if I have a border around my containing div, I want it to expand to enclose the "p" block, but allow the 'big-child' div to extend beyond the border.

因此,如果我在包含div的边界周围有边框,我希望它扩展为包含“p”块,但允许“big-child”div延伸到边界之外。

Seems like it should be simple...

好像它应该很简单......

1 个解决方案

#1


0  

I'm not sure if this is really what you're looking after, however you could float the second child div and give the container an overflow of visible to make sure that it won't contain the floated child:

我不确定这是否真的是你正在寻找的,但是你可以浮动第二个子div并给容器溢出可见的以确保它不包含浮动的子:

.no-expansion-from-big-child {
  border: 1px solid red;
  overflow: visible;
}

.big-child {
  float: left;
}
<div class='no-expansion-from-big-child'>
  <p>This is a block with content, and a child div.</p>
  <div class='big-child'>
    <p>This is a child-block - I want it to overflow outside the borders of its containing div.</p>
  </div>
</div>


注意!

本站翻译的文章,版权归属于本站,未经许可禁止转摘,转摘请注明本文地址:http://www.silva-art.net/blog/2014/09/19/aa3298047279f0913bf5b262db3e7b1d.html



 
© 2014-2019 ITdaan.com 粤ICP备14056181号