HTML/CSS 이미지 높이 따라 가기

Question

나는 여기서 간단한 디자인을하고있다. 그러나 나는 약간의 문제가있다.

여기에 최종 설계의 예를 살펴 준비해주십시오 http://ronnieaarebrot.com/demo/cms/

왼쪽과 오른쪽에있는 메뉴를, 당신은 작은 테두리 중심 콘텐츠의 높이 다음 (상단에서 하단으로가는 볼 수 있습니다).

어떻게하면됩니까? 나는 양쪽에 작은 경계선이있는 배경 이미지를 가질 계획 이었지만 어떻게 센터 내용의 높이를 "계산"해야합니까? 또는 두 개의 테두리를 가운데 div의 높이를 따르도록 만듭니다. 설명하기가 조금 어렵지만 이미지를 확인하십시오. 여기에 얼마나 오는지에 대한 html 예제가 있습니다. http://ronnieaarebrot.com/demo/cms_html/

좋은 해결책이 있습니까?

Answer 1

가장 쉬운 방법은 div 요소에 가운데 내용을 포함하고 테두리 CSS 속성을 사용하여 적용하는 것입니다. 패딩과 여백을 조정하여 가운데 요소와 측면 요소를 서로 맞 춥니 다. 모델을 감안할 때, 중앙 요소의 패딩이 양쪽에 거의 여백이없는 것과 결합되어 트릭을 수행하는 것처럼 보입니다.

Answer 2

당신은 #page_wrap 요소에 overflow:hidden을 넣으면 그것이 될 내용의 높이 (왼쪽, 중앙, 오른쪽 부분)에 정도.

그래서 당신은 backgorund에 이미지를 넣을 수 있습니다 ..

해당 요소에 ( 1 픽셀의 높이가 수직 반복)하고 아래로 모든 방법을 확장 할 것이라는 점을 확실 할