요소 CSS를 재정의하는 방법은 무엇입니까?

Question

사이트의 너비를 설정하는 요소가 있지만 특정 페이지에서 너비를 제거하려고합니다. 요소를 제거 할 수 없으므로 사이트의 모든 페이지가 깨집니다. (특히 헤더 템플릿)

내가

.nopageWidth {마진하고 시도 : 0 자동; 최대 너비 : 1920 픽셀! 중요}

하지만 페이지가 여전히 CSS CSS를 상속하고있었습니다.

이 페이지의 구조 -

.pageWidth { 
 
    padding-right: 5px; 
 
    padding-left: 5px; 
 
    margin: 0 auto; 
 
    max-width: 1350px; 
 
    box-sizing: border-box; 
 
} 
 

 
.nopageWidth {margin: 0 auto; max-width: 1920px !important;}

<div class="pageWidth"> 
 
<div class="pageContent"> 
 
<article> 
 
<div class="nopageWidth"> 
 
</div> 
 
</article> 
 
</div> 
 
</div>

도움을 주시면 감사하겠습니다, 내가 붙어있어!

Answer 1

페이지 너비를 설정하려면 "너비"를 사용해야합니다. "최대 너비"는 가능한 한 최대이며 내용에 따라 다릅니다. 아마도! important는 필요하지 않습니다.

.pageWidth { 
 
    padding-right: 5px; 
 
    padding-left: 5px; 
 
    margin: 0 auto; 
 
    width: 1350px; 
 
    box-sizing: border-box; 
 
} 
 

 
.nopageWidth {margin: 0 auto; width: 1920px !important;}

에만 의미 max-width를 사용하는

Answer 2

은 기본 width는 여전히 기본 100%로 설정됩니다. 따라서 컨테이너의 너비가 1920 픽셀 미만인 경우 .nopageWidth은 부모 요소의 100 %에서 더 넓어지기 때문에 결코 1920 너비가되지 않습니다. 이를 방지하려면 고정 (예 : px 값) width 설정을 사용하십시오.