CSS 그래프 가운데 정렬 문의

CSS 그래프 가운데 정렬 문의

QA

CSS 그래프 가운데 정렬 문의

본문

http://osanmh.com/gnuboard/con_result.html

위 보이는 페이지에 그래프들이 왼쪽으로 정렬이 되어 있는데요..
가운데로 보이게 하고 싶습니다.

아래의 css중에 어느부분에 추가 혹은 수정을 해야 할까요?

 

도움 부탁드립니다.

 

/* Vertical Bar Graph */
.vGraph{padding:0px 0;}
.vGraph ul{ margin:0; padding:0; height:200px; border:0px solid #ddd; border-top:0; border-right:0; font-size:11px; font-family:Tahoma, Geneva, sans-serif; list-style:none;}
.vGraph ul:after{ content:""; display:block; clear:both;}
.vGraph li{ float:left; display:inline; width:15%; height:100%; margin:0 0%; position:relative; text-align:center; white-space:nowrap;}
.vGraph .gTerm{ position:relative; display:inline-block; width:100%; height:20px; line-height:20px; margin:0 -100% -20px 0; padding:200px 0 0 0; vertical-align:bottom; color:#767676; font-weight:bold;}
.vGraph .gBar{ position:relative; display:inline-block; width:100%; margin:-1px 0 0 0; border:1px solid #ccc; border-bottom:0; background:#e9e9e9; vertical-align:bottom;}
.vGraph .gBar span{ position:absolute; width:100%; top:-20px; left:0; color:#767676;}
 

이 질문에 댓글 쓰기 :

답변 2

그래프가 가운데 정렬이 안 되는 이유는

.vGraph li{ float:left; ~ } 에서 float:left; 때문입니다. float:left; 를 삭제한 후 나머지 부분의 위치를 다시 조정해보세요.

 

예를 들면, 아래와 같이 float:left; 삭제,  width:15%; 옮김

.vGraph li{ display:inline; height:100%; margin:0 0%; position:relative; text-align:center; white-space:nowrap;}

.vGraph .gBar{ position:relative; display:inline-block; width:15%; margin:-1px 0 0 0; border:1px solid #ccc; border-bottom:0; background:#e9e9e9; vertical-align:bottom;} 

답변을 작성하시기 전에 로그인 해주세요.
전체 0 | RSS
QA 내용 검색
  • 개별 목록 구성 제목 답변작성자조회작성일
  • 질문이 없습니다.

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT