html - सीएसएस का उपयोग करके खड़ी होने के बजाए एक HTML सूची कैसे क्षैतिज दिखती है?




2 Answers

आपको नीचे की तरह कुछ का उपयोग करना होगा

#menu ul{
  list-style: none;
}
#menu li{
  display: inline;
}
	
<div id="menu">
  <ul>
    <li>First menu item</li>
    <li>Second menu item</li>
    <li>Third menu item</li>
  </ul>
</div>

मुझे इसकी ज़रूरत है क्योंकि मैं एक मेनू बनाना चाहता हूं (जो कि एक HTML सूची से की जाती है) क्षैतिज रूप से प्रदर्शित होती है

मैं पूर्ण स्थिति का उपयोग नहीं करना पसंद करता हूं क्योंकि जब मैं पृष्ठ के लेआउट को बदलना शुरू करता हूं तो यह गन्दा हो सकता है

मैं उप-सूचियों के इंडेंटिंग को हटाना भी चाहूंगा क्या यह संभव है?




इस प्रश्न के लिए यहां एक और तरीका है

डेमो

एचटीएमएल

<div id="menu">
  <ul>
    <li>First menu item</li>
    <li>Second menu item</li>
    <li>Third menu item</li>
  </ul>
</div>

सीएसएस

#menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#menu li {
  display: inline-block;
}



Related

html css menu positioning horizontallist