모니터 화면이 너무 큰 경우 웹 페이지의 상단 헤더를 관리하십시오.

Question

브라우저의 상단 섹션에 헤더가 있습니다. 그것을위한 CSS는 다음과 같습니다 .top 섹션 {

position: absolute; 
height: 83px; 
background: #fcfcfc; 
border-bottom: 1px solid #ededed; 
width: 100%; 
min-width: 1000px; 
border-radius: 10px 10px 10px 10px; 

}

내가 일반적으로 100 % 너비를 사용합니다. 그것은 랩톱 및 소형 모니터에 적합합니다. 그러나 모니터 화면이 21 인치와 같이 너무 크면보기에 좋지 않습니다. 그래서 꼭 필요한 섹션 헤더는 최대 너비보다 커서는 안됩니다. 'maz-width : px'CSS 속성을 사용할 수는 있지만 문제는 왼쪽과 오른쪽에 대칭 여백이 없기 때문입니다. 이것은 다시 나빠 보인다. 따라서 최대 크기를 정의하려면 어떻게해야합니까?하지만 화면 여백이 큰 경우 페이지가 잘 보이도록 적절한 여백이 있어야합니다.

아무도 도와 줄 수 있습니까?

Answer 1

를 사용하여 미디어 쿼리 폭에 따라, 설정 동작 : http://webdesignerwall.com/tutorials/css3-media-queries

Answer 2

당신은, 중앙에 대칭 될 윗부분의 body 및 margin:auto에 대한 text-align:center을 사용하고 position:absolute을 해제합니다. 이제 max-width을 설정할 수 있습니다. this site에게 문의하십시오. 가운데에있는 상자에는 min-width 세트가 있지만 (max-width은 없음) 크기 조정 및 브라우저 창의 크기를 조정하더라도 센터에서는 대칭 적으로 유지됩니다. 해당 상자에 사용 된 CSS를 확인하고 제목에 유사한 CSS를 사용하십시오.

Answer 3

Less framework 또는 그 후속자 인 FramelessGrid과 같은 것을 사용하는 것은 어떻습니까?