채택완료

상단 레이아웃 CSS 가운데 정렬하기.

2014-07-24 (목) 21:26:34 11,648

스크롤바를 내려도 " ​로고부터 상단 메뉴부분 " 까지 통째로... 상단에 고정시키게 하고 싶어서 

이것을

#hd {z-index:4;position:relative;height:142px;min-width:970px;background:#0d0a06 ;}​

 

                                                       ↓

 

#hd {z-index:4;position:fixed;height:142px;min-width:970px;background:#0d0a06 ;margin:0 auto;}​

 

​이렇게 추가를 시켰는데요. 상단에 고정되어 붙어있기는한데, 가운데 정렬이 되질않네요. ㅠㅠ 

 

어디를 수정해야 할까요? ...

상단 레이아웃 ​

Copy
#hd {z-index:4;position:relative;height:142px;min-width:970px;background:#0d0a06 ;margin:0 auto;}.hd_zindex {z-index:10 !important}#hd_h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}#hd_wrapper {position:relative;margin:0 auto;padding:0;width:970px;height:100px;zoom:1}#hd_wrapper:after {display:block;visibility:hidden;clear:both;content:""} #logo {position:absolute; left:0px; top:32px;}
|

답변 4개

채택된 답변
+20 포인트

#hd는 가로 100%라 margin:0 auto를 적용할 필요가 없어보입니다.

실제 중앙 정렬을 해야 하는 div에 width:970px;margin:0 auto를 적용해세요.

위 스타일을 보면 #hd_wrapper 이 부분안에 넣어준 요소들은 970px ​가로폭으로 중앙 정렬이 되겠죠

 

Copy
​#hd {z-index:4;position:fixed​;height:142px;width:100%;background:#0d0a06 ;}​​
​

header 부분만 센터정렬 하고 싶으신거면

head.sub.php 여시면 hd 보다 상위 div 있을겁니다

그거 에 맞는 div css 찾으셔서

text-align: center; 집어 넣으시구요.

#hd {z-index:4;position:fixed;height:142px;min-width:970px;background:#0d0a06 ;margin:0 auto; text-align:left;}

하시면 될겁니다.

#hd {z-index:4;position:fixed;height:142px;min-width:970px;background:#0d0a06 ;margin:0 auto; text-align:left;}


#hd태그 감싸고 있는 div 에​​ { text-align:center; } 추가해보세요~ 

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