2013-12-14 3 views
0

div를 가로 방향으로 정렬 할 수 있도록 노력 중이므로 가로로 스크롤 할 수 있습니다.div를 가로로 스크롤

#content { 
    font-size: 18px; 
    text-align: justify; 
    display: inline-block; 
    vertical-align: middle; 
    overflow-x: auto; 
    height: 70%; 
    margin-top: 15%; 
    margin-bottom: 15%; 
} 

.item { 
    width: 50%; 
    max-height: 70%; 
    margin-bottom: 30px; 
    margin-top: 100px; 
    margin-left: 25%; 
    margin-right: 25%; 
    overflow: scroll; 

} 

감사 : 여기

내 CSS입니다 .. 아니 정말 경험 나는 내가 뭘 잘못 알아낼 수 없습니다!

+1

JSFiddle에서 데모를 만드십시오. – str

+0

HTML이 필요합니다 .... – Ani

답변

0

#content.item을 여러 개 넣고 가로로 배치해야한다고 가정합니다. 그 맞습니까?

그런 다음 너비가 고정 된 너비 인 #content 위에 래퍼가 필요합니다 (스크롤 창). #content 자체가 넓어야 랩퍼가 특성 overflow-x:scroll을 필요로하는 동안 스크롤 할 수 있습니다. .item divs의 수를 알고있는 경우를 제외하고는 #content이 얼마나 넓어야할지 모르기 때문에 자바 스크립트로 설정하는 것이 좋습니다. 마지막으로 .itemfloat: left이 있어야합니다. 그렇지 않으면 가로로 줄을 감싸지 않습니다.

또한 모든 .item에 대해 동일하게하기를 원하지 않는 경우 JS가 #content 높이를 가장 높은 자리 .item으로 설정하도록 할 수 있습니다.

실현하려고하는 경우 at this fiddle을보십시오.

선택적으로 css3 열을 사용할 수 있습니다. IE9 이하를 지원하지 않으므로 아직 사용하지 않을 것입니다. See here how this works.

건배!

관련 문제