가로 스크롤 상자에 줄 바꿈하지 않는 줄을 강요합니까?

-1

CSS 만 사용하면 어두운 상자 (링크)를 줄 바꿈없이 한 줄로 정렬하고 컨테이너 (임시로 div.hurrdurr라고 함)에 링크 줄이 길어지면 가로 스크롤 막대가 있어야합니다. . 나는 또한 그것이 스크롤 될 때 공간에 남을 수 있기를 원하지 않는다. 링크가 동적으로 변경되므로 설정 폭을 사용할 수 없습니다.가로 스크롤 상자에 줄 바꿈하지 않는 줄을 강요합니까?

페이지를 표시하는 데 사용할 수있는 유일한 방법이므로 최신 Firefox에서만 작동해야합니다.

이 내가 무엇을 가지고 :

<!DOCTYPE html> 
<html style="width: 1000px;"> 
    <head> 
     <title>Hurrr</title> 
     <style> 
      div.contain { 
       background-color: #999999; 
       height: 90px; 
       width: 100%; 
      } 
      div.hurrdurr { 
       background-color: #CCCCCC; 
       white-space: nowrap; 
       width: 100%; 
       overflow: auto; 
      } 
      div.hurrdurr a { 
       width: 60px; 
       height: 20px; 
       margin-right: 8px; 
       margin-top: 4px; 
       background-color: #333333; 
       color: #CCCCCC; 
       text-align: center; 

       float: left; 
       display: inline-block; 
      } 
     </style> 
    </head> 
    <body> 
     <div class="contain"> 
      <div class="hurrdurr"> 
       <a class="durr">1/25</a> 
       <a class="durr">2/25</a> 
       <a class="durr">3/25</a> 
       <a class="durr">4/25</a> 
       <a class="durr">5/25</a> 
       <a class="durr">6/25</a> 
       <a class="durr">7/25</a> 
       <a class="durr">8/25</a> 
       <a class="durr">9/25</a> 
       <a class="durr">10/25</a> 
       <a class="durr">11/25</a> 
       <a class="durr">12/25</a> 
       <a class="durr">13/25</a> 
       <a class="durr">14/25</a> 
       <a class="durr">15/25</a> 
       <a class="durr">16/25</a> 
       <a class="durr">17/25</a> 
       <a class="durr">18/25</a> 
       <a class="durr">19/25</a> 
       <a class="durr">20/25</a> 
       <a class="durr">21/25</a> 
       <a class="durr">22/25</a> 
       <a class="durr">23/25</a> 
       <a class="durr">24/25</a> 
       <a class="durr">25/25</a> 
      </div> 
     </div> 
    </body> 
</html>

출처

2012-11-23 TanzNukeTerror

질문에 항상 코드 (또는 적어도 일부)를 게시 해보십시오. –

은 제거하여 귀하의 div.hurrdurr a에서 float:left 그리고 당신이 스크롤을 제공해야합니다.

출처

2012-11-23 02:57:31 AndyWarren

정말 고마워요. 나는 몇 시간 동안 인터넷 검색을하고 있었고 다른 일을 시도했다. 내가 읽은 거의 모든 글은 'float : left;'가 해결책이라고 말했다. 나는 그것이 정확히 무엇에 적용되었는지 생각하지 않았다. 다시 한번; 고맙습니다. 너는 내 하루를 보냈다. – TanzNukeTerror

도와 드릴 수있어서 다행입니다. – AndyWarren

가로 스크롤 상자에 줄 바꿈하지 않는 줄을 강요합니까?

답변

관련 문제