-2
#DIV_1 {
bottom: -10px;
height: 176px;
left: 0px;
position: relative;
right: 0px;
text-align: left;
top: 10px;
width: 379px;
perspective-origin: 189.5px 88px;
transform-origin: 189.5px 88px;
background: rgb(238, 238, 238) none repeat scroll 0% 0%/auto padding-box border-box;
font: normal normal normal normal 14px/normal "Lucida Grande", Helvetica, Arial, sans-serif;
list-style: none outside none;
margin: 0px 0px -5px;
overflow: hidden;
}/*#DIV_1*/
#DIV_2 {
box-sizing: border-box;
float: left;
height: 77px;
text-align: center;
width: 189.5px;
perspective-origin: 94.75px 38.5px;
transform-origin: 94.75px 38.5px;
border-right: 5px solid rgb(255, 255, 255);
font: normal normal normal normal 14px/normal "Lucida Grande", Helvetica, Arial, sans-serif;
list-style: none outside none;
padding: 30px;
}/*#DIV_2*/
#DIV_3 {
box-sizing: border-box;
float: left;
height: 77px;
text-align: center;
width: 189.5px;
perspective-origin: 94.75px 38.5px;
transform-origin: 94.75px 38.5px;
font: normal normal normal normal 14px/normal "Lucida Grande", Helvetica, Arial, sans-serif;
list-style: none outside none;
padding: 30px;
}/*#DIV_3*/
#DIV_4 {
box-sizing: border-box;
color: rgb(255, 255, 255);
float: left;
height: 99px;
text-align: center;
width: 189.5px;
column-rule-color: rgb(255, 255, 255);
perspective-origin: 94.75px 49.5px;
transform-origin: 94.75px 49.5px;
background: rgb(192, 57, 43) none repeat scroll 0% 0%/auto padding-box border-box;
border-top: 5px solid rgb(255, 255, 255);
border-right: 5px solid rgb(255, 255, 255);
border-bottom: 0px none rgb(255, 255, 255);
border-left: 0px none rgb(255, 255, 255);
font: normal normal bold normal 14px/normal "Lucida Grande", Helvetica, Arial, sans-serif;
list-style: none outside none;
outline: rgb(255, 255, 255) none 0px;
padding: 30px;
}/*#DIV_4*/
#DIV_5 {
box-sizing: border-box;
color: rgb(255, 255, 255);
float: left;
height: 82px;
text-align: center;
width: 189.5px;
column-rule-color: rgb(255, 255, 255);
perspective-origin: 94.75px 41px;
transform-origin: 94.75px 41px;
background: rgb(142, 68, 173) none repeat scroll 0% 0%/auto padding-box border-box;
border-top: 5px solid rgb(255, 255, 255);
border-right: 0px none rgb(255, 255, 255);
border-bottom: 0px none rgb(255, 255, 255);
border-left: 0px none rgb(255, 255, 255);
font: normal normal bold normal 14px/normal "Lucida Grande", Helvetica, Arial, sans-serif;
list-style: none outside none;
outline: rgb(255, 255, 255) none 0px;
padding: 30px;
}/*#DIV_5*/<div id="DIV_1">
\t <div id="DIV_2">
\t \t Ben Franklin
\t </div>
\t <div id="DIV_3">
\t \t Thomas Jefferson
\t </div>
\t <div id="DIV_4">
\t \t George Washington
\t </div>
\t <div id="DIV_5">
\t \t Abraham Lincoln
\t </div>
</div>나는 따라서 여러 개의 전화 회선이됩니다, 그 양은 다른 길이있을 수 있습니다 2 열, 그래서 어떻게 콘텐츠의 최소 라인이이 있는지 확인합니까 같은 높이? 콘텐츠의 길이가 그 이상일 수 있기 때문에 고정 된 높이 인 height:100px;을 사용할 수 없습니다.
이 모든의 가장 오래된 CSS 질문입니다 ... 당신이 검색 시도 게시하기 전에 게시 하시겠습니까? –
https://stackoverflow.com/questions/2114757/css-equal-height-columns?rq=1 https://stackoverflow.com/questions/3936587/two-equal-columns-in-css?lq=1 https://stackoverflow.com/questions/17410057/how-to-make-2-horizontal-divs-the-same-height?lq=1 https://stackoverflow.com/questions/33813871/equal-height -columns-with-css? rq = 1 –
답변을 찾으십시오. flexbox가 원하는 것을 얻을 수 있습니다 ... https://css-tricks.com/snippets/css/a-guide-to-flexbox/ – matthewelsom