테스트 사이트 - 개발 중인 베타 버전입니다

css 가로,세로 가운데정렬이요~ 채택완료

zes 8년 전 조회 5,767

<div class="m2con">
<ul>
<li class="m2menu">
<?php
//아래의코드를 배너출력을 원하는 위치에 삽입하세요.
 echo ask_banner_print('demo_main3');
?>
</li>
<li class="onlineq">
<? include_once("form.php"); ?>
</li>
</ul>
</div>

 

 

demo_main3이란 이미지위에 onlineq 의 빠른상담신청이

가로 세로 가운데 정렬이 하게 하려면 어떻게 수정해주어야하나요?

 

 

.m2con {
 background-color: #000;
 background: rgba(0, 0, 0, 0.7);
 overflow-x: hidden;
 position: relative;
 left:0;
 top:0;
 
}

 

 

.onlineq {
 position:absolute;
 max-width:1000px;
 width:100%;
 margin: auto;

 

 

 

 

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

채택된 답변
+20 포인트

absolute 포지셔닝일때는 margin: auto 가 적용되지 않습니다.

이미 문서의 흐름에서 벗어났기 때문이고요.

 

position: absolute;

top: 50%;

left: 50%;

margin-top: -(해당영역의 높이/2);

margin-left: -(해당영역의 너비/2);

 

와 같은 방법이 있습니다.

 

이외에도 중앙정렬하는 법은 많은 방법이 있습니다.

http://webdir.tistory.com/31">http://webdir.tistory.com/31 글을 참조하세요. 

 

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

z
zes
8년 전
고맙습니다~!!// 해결되었네요~

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인