가로 스크롤 막대 표시되지 않음

가로 스크롤 막대를 표시하려고합니다. 하지만 가로 스크롤 막대 대신 div의 높이가 증가하고 overfolw-x를 변경하면 오버플로 스크롤 : 세로 스크롤 막대가 표시됩니다. 아래는 코드입니다. 미리 감사드립니다.가로 스크롤 막대 표시되지 않음

<html> 
<head> 
    <title></title> 
</head> 
<body> 
    <div id="main"> 
     <table style="width:800px; height:500px;border:1px solid black"> 
      <tr style="height:200px;border:1px dotted red;"> 
       <td>Test Text</td> 
      </tr> 
      <tr style="height:200px;border:1px dotted green;"> 
       <td> 
       <div style="width:100%;height:100%;overflow-x:scroll;"> 
        Hello this is a testing text to make sure that the division overflow. 
        Thanks for visiting. bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla blabla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla blabla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla blabla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla blackbla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        blabla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla blabla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla blackbla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla blabla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla blabla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla black bla bla bla bla bla bla bla bla bla bla bla bla bla bla 

       </div> 
       </td> 
      </tr> 
     </table> 
    </div> 
</body> 
</html>

출처

2013-11-21 Zeb-ur-Rehman

이 아닌 여러 줄에 텍스트를 분할 할 경우

.cont{ white-space:nowrap; }

당신은 <br> 태그를 사용할 수 있습니다 div 태그 안쪽에 div를 포함하는 것이 좋습니다 ..... div 대신 테이블 대신 div를 사용하십시오. – malcolmX

네가 맞다.하지만 이것은 ide에 대한 샘플 코드이다. 문제를 제기하십시오. 조언을 주셔서 감사합니다. –

div에 width 수정본을 제공해야합니다.

또한 사용 :

확인이 바이올린 :

http://jsfiddle.net/3Mjuu/3/

출처

2013-11-21 07:13:10 aBhijit

해결책에 대해 감사합니다. 그래,이 경우에는 white-sapce가 속임수를 사용했다. 이것은 샘플 코드이지만 실제 코드에서는 이미지 태그의 리피터를 사용하므로 공백이 작동하지 않습니다. –

"이미지 태그의 중계기"란 무엇입니까? 문제를 복제하기 위해 코드를 업데이트 할 수 있습니까? – aBhijit

이미지를 표시하는 이미지 태그가 포함 된 리피터를 말합니다. –

가로 스크롤 막대 표시되지 않음

답변

관련 문제