是否可以在div中使用＆溢出：auto＆＃39;？

Question

父母和孩子的宽度必须相同。 我看到几个类似的主题，但没有合适的解决方案。

＆＃13;

＆＃13;

.b1 {
  width: 200px;
  margin: 0 auto;
  background-color: orange;
  height: 500px;
  overflow: auto;
}

.b2 {
  height: 400px;
  overflow: auto;
  background-color: #ccc;
}

.text1 {
  margin-top: 100px;
  height: 50px;
  box-shadow: 0 0 50px 0 #00a;  
  background-color: #0b0;
}

＆＃13;

<div class="b2">
  <div class="b1">
    <div class="text">
      <div class="text1"></div>
    </div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

一个想法是为ERROR 8245001 000 20141215 171010 Patch output error in output ERROR 8245001 000 20141215 171010 Patch output error in output ERROR 8245001 000 20150515 171010 Patch output error in output ERROR 8245001 000 20150515 171010 Patch output error in output ERROR 8245001 000 20161215 171011 Patch output error in output ERROR 8245001 000 20161215 171011 Patch output error in output ERROR 8245001 000 20161215 171011 Patch output error in output ERROR 8245001 000 20161215 171011 Patch output error in output ERROR 8245001 000 20171215 171012 Patch output error in output ERROR 8245001 000 20171215 171012 Patch output error in output ERROR 8245001 000 20171215 171012 Patch output error in output ERROR 8245001 000 20180515 171012 Patch output error in output ERROR 8245001 000 20180515 171119 Patch output error in output ERROR 8245001 000 20180515 171119 Patch output error in output 创建一个相对于.b1定位的伪元素（以避免溢出）然后你只需应用与绿色框相同的样式，你就会有溢出的阴影。

.b2

.b1 {
  width: 200px;
  margin: 0 auto;
  background-color: orange;
  height: 200px;
  overflow: auto;
}

.b2 {
  height: 300px;
  overflow: auto;
  background-color: #ccc;
  position:relative; /* Relatively to this:*/
  z-index:0;
}

.text1 {
  margin-top: 80px;
  height: 50px;
  box-shadow: 0 0 50px 0 #00a;  
  background-color: #0b0;
}
.b1:before {
  content:"";
  position:absolute;
  height:50px;
  width:200px;
  background:#0b0;
  top:80px;
  z-index:-1;
  box-shadow: 0 0 50px 0 #00a; 
}