수다닷컴

  • 해외여행
    • 괌
    • 태국
    • 유럽
    • 일본
    • 필리핀
    • 미국
    • 중국
    • 기타여행
    • 싱가폴
  • 건강
    • 다이어트
    • 당뇨
    • 헬스
    • 건강음식
    • 건강기타
  • 컴퓨터
    • 프로그램 개발일반
    • C언어
    • 비주얼베이직
  • 결혼생활
    • 출산/육아
    • 결혼준비
    • 엄마이야기방
  • 일상생활
    • 면접
    • 취업
    • 진로선택
  • 교육
    • 교육일반
    • 아이교육
    • 토익
    • 해외연수
    • 영어
  • 취미생활
    • 음악
    • 자전거
    • 수영
    • 바이크
    • 축구
  • 기타
    • 강아지
    • 제주도여행
    • 국내여행
    • 기타일상
    • 애플
    • 휴대폰관련
  • 프로그램 개발일반
  • C언어
  • 비주얼베이직

그래프 이미지 정렬에 관한 질문입니다.

나예

2023.04.01

보시면 질문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

해결방법이 있으시면 좀 도와주시길 부탁해봅니다 ^^;;

신청하기





COMMENT

댓글을 입력해주세요. 비속어와 욕설은 삼가해주세요.

  • 계획자

    아.. 밥님 댓글보니까 기억났다..
    span class=\txt_bottom: -- 이거 없애시구요..
    .graph { position:relative;}
    .graph img { position:absolute; bottom:0;}
    이렇게 하면 되요.. ㅋ

  • 가온길

    그래프 이미지를 담고있는 span태그를 position:absolute;로 하셔도 될것 같은데요...

  • 거늘

    감사합니다. 소스가 많은 도움이 될것 같아요^^

번호 제 목 글쓴이 날짜
2694724 코딩시 폰트 문제; ㅠ 후력 2025-05-13
2694696 텍스트박스 입력에 관한 문제입니다. 딥공감 2025-05-13
2694668 [질문] 페이퍼비전 PointLight 관련 질문 드려요.. 두바다찬솔 2025-05-13
2694611 Flash Lite 2.1에서 BitmapData와 Matrix 지원안하나요? (3) 이플 2025-05-12
2694582 IE & 파이어폭스 (2) 흙이랑 2025-05-12
2694553 무비클립안의 duplicate 발동이 안돼네요; 딥보라 2025-05-12
2694523 자바 애플릿 질문좀 ^^ (6) 동이 2025-05-12
2694494 [질문] JAVA 또는 C++ 로 프로그램 개발시.. 레지스터리 등록 관련 의문점? (3) 우람늘 2025-05-11
2694469 익스6에서 css버그 나오는것 해결방법좀요 !!!! (6) 원술 2025-05-11
2694442 로컬에선 잘 나오는데 운영에 반영하면 이상하게 나와요. (8) 목화 2025-05-11
2694412 [질문] 이미지 로딩후 사이즈 조절할때 (1) 아담 2025-05-11
2694391 설치형 블로그 쓰시는 분들 어떤거 쓰세요?? (7) AngelsTears 2025-05-10
2694362 Microsoft SQL Server에서 서버만드는법 어둠 2025-05-10
2694333 for문으로 돌린 이름의 제어 (4) 레이 2025-05-10
2694308 이미지 css 도와주세요 ㅠㅠ (2) 애기 2025-05-10
2694223 [급질문]스크롤스파이의 offset값 진나 2025-05-09
2694195 li에 이미지 넣고 세로로 메뉴 구성하는 경우 (1) 예님 2025-05-09
2694167 canvas 질문요. (4) 찬늘봄 2025-05-08
2694136 왜 이렇게 나오는지 이해가 잘 가지 않네요. 부탁드리겠습니다... (2) 세련 2025-05-08
2694111 div , css 공부하고있는데요 잘모르겠어요.. 도와주세요 ㅠ_ㅠ (10) 모람 2025-05-08
<<  이전  1 2 3 4 5 6 7 8 9 10  다음  >>

수다닷컴 | 여러분과 함께하는 수다토크 커뮤니티 수다닷컴에 오신것을 환영합니다.
사업자등록번호 : 117-07-92748 상호 : 진달래여행사 대표자 : 명현재 서울시 강서구 방화동 890번지 푸르지오 107동 306호
copyright 2011 게시글 삭제 및 기타 문의 : clairacademy@naver.com