嵌套div - 100％宽度嵌套在固定宽度的容器中 [英] nested div - 100% width nested in fixed width container

问题描述

如何获得 div B 的宽度为100％，同时嵌套在 Div A 中，固定宽度？

  .divA {width：600px; margin：0 auto;} 
 .divB {width：100％; height：20px; background-color：black} 
 
 .filler {height：800px; background-color：gray} 
  

 < div class ='divA'> 
< div class ='filler'>< / div> 
< div class ='divB'>< / div> 
< / div> 
  

编辑问题是： .divA 有一个位置：相对我必须取出

解决方案>

使用

  .divB {
 width：100％; 
 height：20px; 
 min-width：600px; 
 background-colour：black; 
 position：absolute; 
 left：0; 
 right：0; 
 
} 
  

FullScren视图

小提琴

How can i get div B to have a width of 100% while nested in Div A which has a fixed width?

.divA{width:600px; margin:0 auto;}
.divB{width:100%; height:20px;  background-color:black}

.filler{height:800px; background-color:grey}

<div class='divA'>
 <div class='filler'></div>
 <div class='divB'></div>
</div>

edit the problem was: .divA had a position:relative i had to take out

解决方案

use

.divB {
    width:100%;
    height:20px;
    min-width:600px;
    background-color:black;
    position:absolute;
    left:0;
    right:0;

 }

FullScren view

Fiddle

这篇关于嵌套div - 100％宽度嵌套在固定宽度的容器中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！