ul 의 가운데 정렬
보늬
style type=text/css
ul,li{margin:0;padding:0;list-style:none}
.wrap{position:relative;margin:0 auto;width:250px;height:250px;border:1px solid}
.img{position:relative;}
.btn{border:1px solid;position:absolute;bottom:10px;border:1px dotted #ff0000;}
.btn li{width:20px;height:20px;border:1px solid #ccc;float:left;text-align:center}
/stylediv class=wrap
ul class=img
li/li
/ul
ul class=btn
li1/li
li2/li
li3/li
/ul
/div
이와 같은 구조가 있는데 빨간점선 테두리인 btn ul 를 가로 가운데 정렬하기가 어렵네요...
1,2,3 버튼이 추가 삭제되어도 중앙정렬이 될 수 있게 할려면 어떻게 하면 좋을까요?
정말 css 적응하기 힘들군요...
-
헤벌심
어라인은 플로팅하면안먹죠...
블록요소가대니 -
도도
해당 소스도 약간 수정해야 할텐데 기존 소스 활용하면 요렇게?
의도하고자 하는게 이게 맞는지 모르겠네요 ;;
.wrap{position:relative;margin:0 auto;width:250px;height:250px;border:1px solid #000}
ul,li{margin:0;padding:0;list-style:none}
.img{position:relative}
.btn{position:absolute;left:50%;bottom:50 -
쌍둥이자리
아 첨부파일안보고
걍 만들었네요 ㅎㅎㅎㅎ 함 볼께요 ㅎㅎㅎㅎ -
소율
아 전 작성자님 안보고 수다님이 작성자분인줄 알고 ㅎㅎㅎㅎ
공부중이신것같아요
이러면서 하나씩 느는거죠 뭐 ㅋ -
하나
제가 원문작성자는 아니네용~ ^^;;
저도 css 깔끔하게 사용하지는 않지만 원문 작성자 님은 css좀 깔꿈하게 좀 쓰셔야 할듯... -
민트맛사탕
.btn:after{content:\\;display:block;clear:both;}
이거 추가용;; -
한가람
.btn에 absolute를 주셨네요
이건 top,left으로 강제적으로 마추거나 제가 위에 쓴 소스를 쓰시거나
혹은 다른방법으로 마추셔야될것같아요
하나더 깜빡하고 높이위치를 안마췄는데 높이는 margin이나 padding으로 해결될것같네요. -
청식
혹시 코드에서 돌려 보셨어요? 뭔가 이상하게 나와요..;;;
-
꼬꼬마
ul,li{margin:0;padding:0;list-style:none}
.wrap{position:relative;margin:0 auto;width:250px;height:250px;border:1px solid #000;}
.img{position:relative;}
.btn{border:1px solid;bottom:10px;border:1px dotted #ff0000;margin:0 auto;width:66px;}
.btn li{width -
보아라
text-align:center요~
엇 밖에 나와있는 소스를 자세히 안봤네용~ position을 적용하였네용 ㅋ position값을 빼보세용~ul부분에 넓이값을 주고 text-align:center; 로 하시면 될듯하네용~