css - 如何在css中为没有垂直滚动的部门制作水平滚动

Question

这是模式，我需要使 ul 列表与水平滚动保持对齐，如果它超过了一些宽度，如 460px，而在 css 中没有垂直滚动条。

<div class=parentDiv>
       <ul>            //here i need to give a horizontal scroll without vertical scroll
             <li>content</li>   //  with left align
             <li>content</li>
             <li>content</li>
             <li>content</li>                
             <li>content</li> .....etc 
       </ul>    
 </div>

Answer 1

尝试这个：

<div class=parentDiv>
   <ul>          
         <li>content</li>  
         <li>content</li>
         <li>content</li>
         <li>content</li>                
         <li>content</li> 
         <li>content</li> 

   </ul>    
</div>​

和CSS

.parentDiv{
 width: 300px;
 overflow-x: scroll; 

 }

.parentDiv ul{
 width: 400px;
 border: 1px solid orange;

 }

 .parentDiv ul li{
 display: inline;
 margin-right: 8px;
 }

​</p>

检查我制作的小提琴：JsFiddle

Answer 2

给它overflow-x：滚动属性，将最大宽度设置为460px，你应该会得到一个水平滚动。我不确定你的左对齐是什么意思。不是左对齐吗？