4 개의 div가 2 개 div가 연속으로 정렬되는 컨테이너 div의 내용을 중앙에 배치하려고했지만 중앙에 위치하지 않습니다.
이것이 Google 크롬 및 기타 브라우저에서 발생하는 이유를 모르겠습니다.
아래는 코드입니다. 도와주세요.
CSS :
.container{
margin: auto;
width:80%;
height:900px;
display: block;
text-align: center;
}
.column, .columns {
float:left;
min-height:1px;
padding:0 15px;
position:relative
}
section#{
width: 100%;
min-height: 500px;
background: url(../images/sidebar_shadow.png) repeat-y left top;
float: left;
margin-top: -2px;
}
.button.largebutton {
min-width:400px;
min-height:300px;
float:left;
margin: 60px;
}
PHP
<section id="main" class="column">
<h1 class="info_bar">My Surveys</h1>
<div class="container"> //contents of this div to be centered
<?php include 'tabcontainer_surveyholder.php'; ?> //pulls the four divs
</div>
</section>
이에 대한 한 가지 해결책은 다음과 같습니다.
4 개 div를 래퍼로 감 쌉니다. 콘솔에서 래퍼의 너비를 확인하고 다음 CSS를 작성합니다.
.wrapper{ position:relative;
left:50%;
margin-left:-(half of its total width);
}
여기에 코드 펜이 있습니다
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다