그래프 이미지 정렬에 관한 질문입니다.
나예
보시면 질문1은 가로형그래프고
질문2는 세로형 그래프입니다.
이게 원래 테이블안에 테이블로 코딩되어있던 페이지인데 접근성 보완작업을 하고있습니다.
저 그래프 이미지를 리스트안에 넣었는데 말입니다.
vertical-align: bottom; 이 들어먹질 않습니다.
수치로 조정하려고 해도저것들이 가변적이기에; 고정값을 줄수가 없고요.
원래는 td 안에 테이블안에 그래프가 들어가서 valign=bottom 으로 정렬되어있던 것들인데
li 안에 집어넣고 바꾸려니 하단정렬이 안되네요.
기본적으로img{vertical:middle;}가 셋팅css에 포함되어있긴합니다.
이미지태그안에 직접 스타일을 넣어줘 보기도 하고
lispanimg src= alt=/span/li
이런식으로 li 안에 span 으로 한번 더 감싸서 클래스를 줘보기도 했는데 안되네요.
혹시나해서 소스는..dl.research_q2 {position:relative;clear:both;width:550px;}
dl.research_q2 dt {width:550px;}
dl.research_q2 dd {float:left;height:120px;width:90px;}
ul.research_list2 {clear:both;width:90px;height:100px;padding:0;}
ul.research_list2 li.kind {height:16px;margin:0 0 0 5px;text-align:center;}
ul.research_list2 li.graph {height:68px;width:100px;margin:0 0 0 0;text-align:center;}
ul.research_list2 li.num {width:100px;height:16px;text-align:center;}
tr
th scope=row질문2/th
td
!-- 세로형그래프 --
dl class=research_q2
dt귀하의 연령은 어떻게 되십니까?/dt
dd
ul class=research_list2
li class=num14 명 (35%)/li
li class=graphspan class=txt_bottomimg src=height_01.gif height=25% width=60 alt=/span/li
li class=kind1. 55세 미만/li
/ul
/dd
dd
ul class=research_list2
li class=num26 명 (65%)/li
li class=graphspan class=txt_bottomimg src=height_02.gif height=35% width=60 alt=/span/li
li class=kind2. 55세 초과/li
/ul
/dd
dd
ul class=research_list2
li class=num26 명 (65%)/li
li class=graphspan class=txt_bottomimg src=height_03.gif height=25% width=60 alt=/span/li
li class=kind3. 55세 초과/li
/ul
/dd
dd
ul class=research_list2
li class=num26 명 (65%)/li
li class=graphspan class=txt_bottomimg src=height_04.gif height=45% width=60 alt=/span/li
li class=kind4. 55세 초과/li
/ul
/dd
dd
ul class=research_list2
li class=num26 명 (65%)/li
li class=graphspan class=txt_bottomimg src=height_05.gif height=75% width=60 alt=/span/li
li class=kind5. 55세 초과/li
/ul
/dd
/dl
!-- 세로형그래프 --
/td
/tr
해결방법이 있으시면 좀 도와주시길 부탁해봅니다 ^^;;
-
계획자
아.. 밥님 댓글보니까 기억났다..
span class=\txt_bottom: -- 이거 없애시구요..
.graph { position:relative;}
.graph img { position:absolute; bottom:0;}
이렇게 하면 되요.. ㅋ -
가온길
그래프 이미지를 담고있는 span태그를 position:absolute;로 하셔도 될것 같은데요...
-
거늘
감사합니다. 소스가 많은 도움이 될것 같아요^^
번호 | 제 목 | 글쓴이 | 날짜 |
---|---|---|---|
2655352 | 동영상 플래이어 (2) | 머슴밥 | 2024-05-19 |
2655320 | GList를 사용하는데 에러가 발생합니다. 도와주세요~~ | 찬늘봄 | 2024-05-18 |
2655291 | 자바 초보입문했는데요~~ | 이퓨리한나 | 2024-05-18 |
2655235 | xml연동 갤러리 생성관련 질문입니다. (2) | 난새 | 2024-05-18 |
2655205 | C++ 포인터 if | WatchOut | 2024-05-17 |
2655150 | 모바일 웹 환경을 구축을 할때의 콘텐츠 이미지 사이즈 (2) | 레오 | 2024-05-17 |
2655122 | 엥;; getMonth() 왜이렇게 나타나죠? (6) | 초코맛캔디 | 2024-05-17 |
2655095 | 구구단 질문이요 (3) | 하예진 | 2024-05-16 |
2655064 | RSA.js 파일 구할 수 있을가요.. 있으신분 첨부좀 해주세요.. | 얀 | 2024-05-16 |
2655009 | 유료테마 사려고 하는데 데모파일이 없다면 | 에드가 | 2024-05-16 |
2654980 | cximage를 통해 jpg파일을 받아와 윈도우에 뿌리는 프로그램을 만드는중인데 꼬였습니다. (4) | 하린 | 2024-05-15 |
2654922 | 고도몰 3차 4차 이상 카테고리 표출되게.. (7) | 유메 | 2024-05-15 |
2654874 | 제이쿼리랑 자바스크립트 학원 추천좀부탁드릴게요 (7) | 향율 | 2024-05-14 |
2654843 | 탭버튼 코딩시 마우스오버가 접근성에 왜 어긋나는지 궁금합니다... (1) | 걸때 | 2024-05-14 |
2654814 | 중국어 인코딩 관련해서 질문요,,, (5) | 화이트캣 | 2024-05-14 |
2654783 | 이 알고리즘 한줄한줄 해석좀 부탁드립니다. (1) | 요루 | 2024-05-14 |
2654764 | t 탭 질문이여. (3) | 눈 | 2024-05-13 |
2654737 | 크롬 인쇄하기 오류 (멈춤현상) | 아라 | 2024-05-13 |
2654708 | ie6에서 margin 문제 (5) | 너만 | 2024-05-13 |
2654681 | 아까 올렸던 질문의 액션코딩 (3) | 큰꽃들 | 2024-05-13 |