너비가 700px이고 높이가 500px 인 오버레이가 있습니다. 내용이 상당히 길어서 사용자가 오버레이 내에서 위/아래로 스크롤 할 수 있어야합니다.오버레이의 verticle 스크롤 막대
스크롤 막대의 너비가 브라우저마다 다르다는 사실을 고려하여 설정하는 방법에 대한 제안을 얻을 수 있습니까?
예를 들어 오버레이 래퍼에 패딩 오른쪽 15px를 추가하면 Firefox에서 훌륭하게 표시됩니다. 콘텐츠가 div 내에 완벽하게 맞춰지며 가로 막대가 나타나지 않습니다.
다른 브라우저에서는 수직 스크롤 막대가 20px 너비 일 수 있습니다. 이로 인해 내용이 수평으로 스크롤되거나, overflow-x를 사용하지 않으면 오른쪽에서 5px만큼 잘립니다.
브라우저에 관계없이 세로 스크롤 막대가 나타나면 오버레이 래퍼의 너비가 조정되어 가로 스크롤 막대없이 내용을 완벽하게 표시 할 수 있습니까?
도움을 주시면 감사하겠습니다.
Overflow property 다음과 같은 소리가 들립니다. overflow:scroll;? 그러나 스크롤바의 너비가 다른 점에 대해 우려하지는 않습니다. 이 변수가 어떻게 설정 되나요?
다른 문제를 살펴보고 오버레이 래퍼를 사용하여 div를 다른 div에 넣은 다음 새 div에 scroll 속성이 있으므로 첫 번째 항목이 스크롤 막대와 아무 관련이 없습니다. 예 : [link]
편집 : 예를 들어, this과 같은 것을 원하십니까? 트릭은 위의 div를 모든 것 주위에 놓는 것과 같지만 대신 너비를주고 그 값을 display:inline-block; (display)으로하지 않으므로 자식에 맞을 수 있습니다 (그러나 스크롤 휠은 자식 바깥에있게됩니다).
편집 2 : 주 당신이 화면에 중심을해야하는 경우, 당신은 인라인 블록을 둘러싼 또 다른 부모 DIV 있고, 인라인 블록 text-align:center;이 있어야합니다. (example)
최대 너비 및 jquery 스크롤 막대 플러그인 jscrollpane을 사용하십시오.
필요한 경우 각 브라우저의 스크롤 막대 폭과 스타일을 정의 할 수 있습니다.
넣어 '높이 = 100 %; 오버레이 – krish
실례 위해'난 내가 분명하지 않다 생각합니다. 높이를 사용할 수 없습니다 : 100 %는 전체 페이지가 스크롤되도록하기 때문에 단순히 오버레이 자체 내에서 스크롤하려는 것입니다. 위의 질문을보다 명확하게 업데이트하겠습니다. – Stefan
콘텐츠와 브라우저에 따라 오버레이가 동적 높이를 가져야한다는 뜻입니까? – krish