CSS 겹치는 사업부의

Question

전 4 DIV 년대 있습니다

#centered { 
    position: absolute; 
    top: 50%; 
    left: 52%; 
    width: 500px; 
    height: 500px; 
    margin-top: -250px; /* Half the height */ 
    margin-left: -250px; /* Half the width */ 
    } 
#container{ 
    width:100%; 
} 

이 (왼쪽과 오른쪽이 컨테이너에)

#left{ 
     float:left; 
     width: 260px; 
     height: 600px; 
    } 
    #right{ 
     float: right; 
     top: 50%; 
     width: 160px; 
     height: 600px; 
    } 

가 중심 사업부는 페이지의 중앙에 항상이고, 다른 두 옆에있다. 사용

body { min-width:1150px; } 

이 항상 #centered와 #right 사이의 공간입니다. 하지만 페이지를 줄이면 공백이 없으며 #centered와 #left 사이에 겹침을 초래하는 사이의 공간이 유지됩니다. 내가 어떻게 할 수 있니?

Answer 1

도랑을 추가하고 그에 따라 위치를 조정하거나 #left 너비를 줄일 수 있습니다. #left 및 #right 너비에 대해 px 대신 백분율을 사용하면 크기를 조정할 때 더 부드럽게 표시됩니다.