2013-12-18 5 views
0

그래서 나는 최근에 내 고객의 사이트를 업데이트했습니다. 매우 간단하게하고 싶었습니다. 일반적으로 사이트를 설계하여 특정 너비로 ​​설정 한 다음 페이지에서 가로로 배치했습니다. 그들이 요청한 갤러리 때문에 나는 960px의 최소 너비와 576px의 최대 높이로 사이트를 100 % 만들었습니다. 대부분의 경우 텍스트 내용이 제한되어 있으므로 페이지의 전체 너비가 960 픽셀 일 때 Div에 수직 스크롤이되는 페이지가 몇 개 있습니다. Div 상자는 overflow-x : auto를 사용합니다. 명령. 이것은 하나의 페이지를 제외한 모든 페이지에서 잘 작동합니다 ..사업부 수직 스크롤

예를 들어 다음 페이지는 100 %로 훌륭하게 보이며 창 너비가 스크롤해야하는 곳으로 바뀌면 스크롤 막대가 맨 오른쪽에 있습니다. http://www.lisagleeson.com/about/

나는 다음 페이지에 작은 문제가 있습니다

: http://www.lisagleeson.com/resume/

이 페이지의 내용이 화면이 넓은 때 3 일을 위해 .. 이상적으로는 좋은 것 2 열로 내용을 분할 설정입니다 충분히,하지만 작은 2 열로 되돌릴 수 있습니다. 지금까지 내가 그것을 2 열로 설정하고 괜찮아 보이는, 내가 알 수있는 유일한 문제는 수직 스크롤바와 함께입니다. 오히려 오른쪽 끝에있는 스크롤 막대가 2 열을지나갑니다. 스크롤바가 맨 오른쪽에있는 곳을 수정하는 방법이 있습니까?

여기에 CSS를 사용하고 있습니다. 콘텐츠는 주요 Div이고 textContent는 그 안에 들어가고 이력서는 그 안에 들어갑니다. 도움에 미리

감사합니다 ...

#content { 
width: 100%; 
min-width: 960px; 
height: 576px; 
margin-top:20px; 
position: absolute; 
background-color: #ffffff; 
display: none; 
} 

#textContent { 
min-width: 400px; 
height: 515px; 
float: left; 
margin: -525px 20px 10px 520px; 
padding: 10px 0px 0px 20px; 
overflow-x: auto; 
} 

#resume { 

-moz-column-count: 2; 
-webkit-column-count: 2; 
column-count: 2; 

-moz-column-gap:40px; 
-webkit-column-gap:40px; 
column-gap:40px; 

-moz-column-rule: 1px outset #eeeeee; 
-webkit-column-rule: 1px outset #eeeeee; 
column-rule: 1px outset #eeeeee; 

} 

답변

0

스크롤 막대가 스크롤이 필요합니다 사업부의 오른쪽에 표시되어야합니다.

#textContent의 너비를 늘리면 스크롤바가 더 오른쪽으로 이동합니다. 정적 픽셀 크기로 설정하는 문제는 화면 크기가 작은 사람들에게 페이지 가장자리에서 밀려날 수 있다는 것입니다.

#textContent를 width:100%으로 설정하여 도움이되는지 확인해보세요.

+0

은 #textContent를 width : 100 %로 변경했지만 모든 것이 오른쪽으로 밀렸으며 열의 너비는 더 작았습니다. – mwgideon

+0

흠. 즉, 다른 레이아웃이 일반 레이아웃으로 전환되고 있음을 의미합니다. jsfiddle.net에 베어 본 버전을 설치하여 문제를 격리시킬 수 있습니까? – Ampersand