CSS의 상속 너비

안녕하세요. 내 문제는 내가 브라우저의 전체 너비 걸쳐 strecth .mylargeframe 싶습니다.CSS의 상속 너비

CSS

.mylargeframe { 
    background: linear-gradient(top, #fff, #f8f8f8); 
    border: 1px solid #d0d2d5; 
    border-bottom: 1px solid #bebfc2; 
    border-radius: 4px; 
    margin: 0 0 20px 0; 
    padding: 20px; 
    width: 80%; 
    overflow: auto; 
} 

fieldset { 
    background:#ebeced; 
    border: none; 
    border-top: 1px solid #d0d2d5; 
    border-radius: 0 0 4px 4px; 
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); 
    margin: 5px 0 -20px -20px; padding: 18px 20px; 
    width: auto; 
} 

fieldset input { 
    margin: 0; 
    width: auto; 
}

HTML

<html> 
    <div class="mylargeframe"> 
    <fieldset> 
    test 
    </fieldset> 
    </div> 
</html>

문제는 완전히 충전되지 않는 것입니다, 그러나 그것은 거의있다. Firefox 및 Chrome을 사용하고 있습니다.

출처

2013-03-18 Badmiral

당신은'폭 '.mylargeframe'. 왜 당신은 그것을 전체적인 방법으로 가기를 기대합니까? –

width: auto;을 fieldset, 100%으로 바꿉니다.

fieldset 
{ 
    background:#ebeced; 
    border: none; 
    border-top: 1px solid #d0d2d5; 
    border-radius: 0 0 4px 4px; 
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); 
    margin: 5px 0 -20px -20px; padding: 18px 20px; 
    width: 100%; 
}

이제 fieldset는 부모의 width을 차지합니다. 80 %`:하며 필드 셋이 사업부를 채울 것입니다

출처

2013-03-18 03:22:47

이 방법)

fieldset 
{ 
    width:100%; 
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ 
    -moz-box-sizing: border-box; /* Firefox, other Gecko */ 
    box-sizing: border-box;   /* Opera/IE 8+ */ 
}

당신은 그렇지 폭이 될 것입니다, 100 % + 마진 상자 크기 조정이 필요합니다은

출처

2013-03-18 03:24:13

CSS의 상속 너비

답변

관련 문제