CSS 배치 질문 드려요.
본문
<div id="wrap">
<!-- 헤더영역 -->
<div id="header">
<!-- 상단사이트명 영역 -->
<div id="header-title">
<a href="/"><img src="/main/img/main_name.jpg" alt=""></a>
</div>
<!-- 메뉴 영역 -->
<div id="menuArea">
<ul class="top-member-menu">
<?php if ($is_member) { ?>
<li><p><a href="<?=G5_BBS_URL?>/logout.php"><img src="/main/img/top_bt_icon03.png">로그아웃 </a></p></li>
<?php } else { ?>
<li><p><a href="<?=G5_URL?>/main/member/join.php"><img src="/main/img/top_bt_icon02.png">회원가입 </a></p></li>
<li><p><a href="<?=G5_URL?>/main/member/login.php"><img src="/main/img/top_bt_icon03.png">로그인 </a></p></li>
<?php } ?>
</ul>
<ul class="top-menu">
<li><p><a href="<?=G5_URL?>/main/member/mypage.php"><img src="/main/img/top_bt_icon01.png">신청내역확인</a></p></li>
</ul>
</div>
</div>
</div>
header-title 옆에 menuArea 배치하고 싶은데 CSS를 float: center 와 float:right로 하면 되는거 아닌가요? 왜 안되죠?
header-title 이건 가운데 배치하고 그 오른쪽 500px 떨어진곳에 menuArea를 배치하려고 하는데 어떻게 해야하나요?
답변 1
float 속성은 left right가 있고 center는 없습니다
센터 정렬은 margin : auto로 하시거나 text-align:center
또는 하위 브라우저 호환성을 포기한다면 display flex속성을 사용하여 쉽게 할 수 있습니다.
답변감사합니다
