정렬문제입니다
빛길
div id=allmenu_wrap
h1 class=all_titimg src=../../images/putkr/main/all_tit01.gif //h1
h1 class=all_titimg src=../../images/putkr/main/all_tit02.gif //h1
h1 class=all_titimg src=../../images/putkr/main/all_tit03.gif //h1
h1 class=all_titimg src=../../images/putkr/main/all_tit04.gif //h1
h1 class=all_titimg src=../../images/putkr/main/all_tit05.gif //h1
h1 class=all_titimg src=../../images/putkr/main/all_tit06.gif //h1
!--aa메뉴 리스트--
ul class=ul_cam
li class=tit_biga href=#About /a/li
lia href=#aaaaa/a/li
lia href=#bbbbb/a/li
lia href=#ccccc/a/li
/ul
!--bb 메뉴 리스트--
ul class=ul_info
li class=tit_biga href=#info/a/li
lia href=#ddddd/a/li
lia href=#eeeee/a/li
lia href=#fffffffffff/a/li
/ul#allmenu_wrap { height:400px; border:2px #2b35b5 solid; width:936px; background:url(../../images/putkr/main/allmenu_bg.gif) repeat-y}
#allmenu_wrap .all_tit { height:30px; width:140px; background:#f9f9fd; padding:8px 0 0 15px; float:left; margin-right:1px}
#allmenu_wrap a { font-size:11px; color:#737373; letter-spacing:-1px;}
#allmenu_wrap .ul_cam { margin:0 0 0 20px; clear:left;}
#allmenu_wrap .ul_info { margin:0 0 0 30px;}
#allmenu_wrap li { background:url(../../images/putkr/common/dot_rec_gray.gif) no-repeat 0 4px; padding-left:7px;}
#allmenu_wrap .tit_big { font-weight:bold; background: none; line-height:20px; padding:10px 0 0 0 ;}
#allmenu_wrap .tit_big02 { font-weight:bold; background: none; line-height:20px; padding:0 ;}
이런식의 ul작업을 하는데요
h1을이용해서 상단타이틀부분(안내/정보) 을 깔아주고 정렬을 플롯 left했구요
문제는 아래 내용 리스트 부분입니다.
about에대한 ul 옆에 정보에 관한 ul을 붙여서 정렬하고 싶은데요
플롯을써도 안되고 어디를 어떻게 수정해야 하는건ㄱ요 ?
ul에 플롯 left주면 제가 원하는대로 옆으로 가긴하나,,ie6과 파폭에서 의 간격차이가 심하게 있습니다.
-
앨런
h 태그와 ul을 하나로 묶지 않아도 정렬은 가능하겠지요?ㅎㅎ
각 태그의 width값 잡아주셔서,,,잘하면-ㅋㅋ
위의 디자인은 안내, 정보 그리고 각각 그 하위 리스트 들이니까,,하나로 묶어주시면 될것 같아요~^^
table in table은 코드도 길어지고 나중에 보기 복잡하지만,,
div 하나 더 쓰신다고 그렇게 되진 않잖아요??ㅋㅋ
그냥 그룹?? 묶음?? 표시 해주는거라고 생각하시면 되지 않을까요?
그게 더 보기도 좋고~^^ -
마루
네 저도 방금 피융님 말씀처럼 코딩을해서 문제없이 했습니다.
근데 궁금한게 생겼습니다.
전 h1과 ul을 한묶음으로 안묶고도 충분히 정렬이 가능할거라 생각했거든요 근데 안되네요 원래 불가능한걸 제가 생각을 잘못하고 시도하려고 한건지 아님 그렇게도 가능한데 제가 못하고있는건지 궁금합니다...
테이블 코딩할때 웬만하면 테이블인 테이블을 안하고자 테이블을 최대한 적게쓰는식으로 코딩하던 생각이 잇어서 그런지 div코딩도 최대한 div로 묶고 또 묶고 하는걸 -
소라
div style=\width:100px;float:left;\
h*/h*
ul
li style=\background:(url) no-repeat 0 50%;padding:7px;\/li
/ul
/div
div style=\width:100px;float:left;\
h*/h*
ul/ul
/div
그냥(대략,, ) 이런코드 안될까요?? -
제나
{display:inline}이거를 해봤는데요 블릿이미지들은 제자리로 가는데 텍스트들은 뚤떨어져있네요
물론 파폭에는 변화없구요 -
접시
ul {display:inline} 속성을 추가해보세요 ie6에서 문제가 생긴다면 더블마진버그 일것같습니다.
그리고 한가지 또 말씀드리자면 현제의 마크업 방식 보다 \\
h*
ul
h*
ul
h*
ul
.
.
.
.
이런식의 마크업이 접근성측면이나 구조적인 측면에서 더 젛을거 같습니다.