2012-10-12 3 views
1

오버 플로우를 숨김으로 설정하지 않는 한 고정 높이가 있더라도 텍스트는 위에서 아래로 이동합니다. 텍스트를 세로에서 가로로 이동하는 방법이 있는지 궁금합니다. 커다란 MS 단어를 큰 화면에서 열어 놓고 왼쪽의 첫 번째 페이지와 오른쪽의 두 번째 페이지를 볼 수있는 것과 같은 것입니다. 내가 계획하고있는 웹 사이트에서 동일한 효과를 얻고 싶습니다.흐름 텍스트 가로

감사합니다.

+0

은 반쯤에 대한이 페이지 http://www.html5rocks.com/en/tutorials/flexbox/quick/을 보라 . – xception

답변

1

CSS의 영역은 여기에 큰 도움이 될 수 있지만, 오늘의 그들이 진행중인 작업을하고 아주 작은 브라우저 지원합니다. 여기

http://jsfiddle.net/MadLittleMods/wpTX7/가 200 픽셀 높이에서 수평으로 열으로 분할하는 일부 CSS입니다 :

그러나 당신이 사용할 수있는 것은 column-count하고 여기에

column-gap입니다 내가 채찍질 바이올린입니다.

#overflow_horizontal 
{ 
    height: 200px; 
    overflow: scroll; 

    -moz-column-count: 2; 
    -moz-column-gap: 24px; 
    -webkit-column-count: 2; 
    -webkit-column-gap: 24px; 
    column-count: 2; 
    column-gap: 24px; 
} 

편집 : 여기

은 대체입니다. jsFiddle : http://jsfiddle.net/MadLittleMods/SEDaQ/

텍스트/일반 리소스가 좋지 않기 때문에 바이올린은 작동하지만 IE9에서는 작동하지 않습니다. 나에게 Columnizer에 대한 정적 링크를 얻을 수 있다면 나는 바이올린을 업데이트 할 수 있으며 잘 작동 할 것이다.

ModernizrColumnizer을 추가하십시오.

(당신이 필요로하는 무엇에 변경 # 열)이 jQuery를 추가

$('.no-csscolumns > #overflow_horizontal').columnize({ 
    columns: 3 
});​ 
+0

적어도 IE9에서 작동합니까? –

+0

@MrA jQuery 폴백 작업 중 ... – MLM

+0

사용 가능한 경우 어떤 대체 시스템을 사용해야합니까? –

0

1. 삽입 -> 끊기 -> 섹션 나누기 (다음 페이지 섹션 나누기).

2. 파일 -> 페이지 설정 -> 경관 설정

+0

웹 페이지를 의미합니다. 그대를 생각해 주셔서 감사드립니다. –

0

왜 그렇게하고 싶은지 모르겠지만 작동하는 웹 페이지처럼 들리지는 않지만 요소 폭을 설정하면 10000px 및 자동으로 오버플로하면 텍스트가 화면의 측면에서 벗어나게 할 수 있습니다.

http://jsfiddle.net/NHD2e/

이 질문있다 : Continuing overflowed text in a different div?

+0

나는 윈도우 8 느낌, 또는 새로운 MySpace 접근법과 비슷하지만 그 극단적 인 것은 아니다. –

+0

그건 의미가 있습니다. div 세트를 사용하여 왼쪽으로 모두 플로트하고 운전을 할 때마다 플로트를 지울 수 있습니다. 여기 9 단계를 참조하십시오. http://www.barelyfitz.com/screencast/html-training/css/ positioning/ –

관련 문제