क्षैतिज रूप से सूचीबद्ध उल को क्षैतिज रूप से ओवरफ़्लो (और स्क्रॉल) प्राप्त नहीं कर सकता है

मैं एक अनियंत्रित सूची को क्षैतिज रूप से सूचीबद्ध करने की कोशिश कर रहा हूं (फ्लोट: बाएं के साथ पूरा), लेकिन यह क्षैतिज रूप से बहने से इंकार कर देता है। इसके बजाय, यह स्वचालित रूप से भी अतिप्रवाह-y के साथ अगली पंक्ति (इसके अलावा में overflows,:।? कोई नहीं, यह स्वचालित रूप से एक ऊर्ध्वाधर स्क्रॉलबार बनाता है कोई भी विचारक्षैतिज रूप से सूचीबद्ध उल को क्षैतिज रूप से ओवरफ़्लो (और स्क्रॉल) प्राप्त नहीं कर सकता है

<style type="text/css"> 
    ul { 
     height:15px; 
     width:400px; 
     overflow-y:none; 
     overflow-x:auto; 
    } 

    li { 
     float:left; 
    } 

</style> 

<body> 
    <div> 
     <ul id="someList"> 
      <li>element 1</li> 
      <li>element 2</li> 
      <li>element 3</li> 
      <li>element 4</li> 
      <li>element 5</li> 
      <li>element 6</li> 
      <li>element 7</li> 
     </ul> 
    </div> 
</body>

स्रोत

2011-06-28 achow

क्या मैं पूछ सकता हूं कि आप एक अनियंत्रित सूची पर क्षैतिज स्क्रॉल बार किस संदर्भ में चाहते हैं? – Zoidberg

अगर मैं सही ढंग से समझ, यह होना चाहिए:

http://jsfiddle.net/Uyc8d/

मैं display: inline-block (float: left के बजाय) बदल लिया है, और मैं white-space: nowrap उपयोग कर रहा हूँ रैपिंग को रोकने के लिए।

ul { 
    width: 400px; 
    overflow-x: scroll; 
    background: #ccc; 
    white-space: nowrap 
} 

li { 
    display: inline-block; 

    /* if you need ie7 support */ 
    *display: inline; 
    zoom: 1 
}

स्रोत

2011-06-28 22:29:23 thirtydot

मैं प्रभावित सर खड़ा हूँ। – Zoidberg

धन्यवाद, अच्छा महोदय। प्रभावशाली। – achow

सफेद-स्थान: अब्रैप; मेरी मदद की, धन्यवाद! –

क्षैतिज रूप से सूचीबद्ध उल को क्षैतिज रूप से ओवरफ़्लो (और स्क्रॉल) प्राप्त नहीं कर सकता है

उत्तर

संबंधित मुद्दे