javascript - css center middle element in div for multiple screen sizes -
& lt; div वर्ग = "add_nav_header" & gt; & Lt; div class = "centerButtons" & gt; & Lt; एक क्लास = "बीटीएन लॉगआउट स्मॉल बीटीएन" डेटा-रोल = "बटन" & gt; & lt; / a & gt; & Lt; एक वर्ग = "बीटीएन खोज छोटाबीटीएन" डेटा-रोल = "बटन" & gt; & lt; / a & gt; & Lt; एक क्लास = "बीटीएन विज़िलिस्ट छोटाबटन" डेटा-रोल = "बटन" & gt; & lt; / a & gt; & Lt; / div & gt; & Lt; / div & gt; .centerbuttons {चौड़ाई: 50%; मार्जिन: 0 ऑटो; } .add_nav_header {display: inline-block; चौड़ाई: 100%; सीमा नीचे: 1px ठोस # सीसीसी; पैडिंग-नीचे: .5 एएम; } .smallBtn {float: right; मार्जिन: .3 ईएम; पैडिंग: .6म; फ़ॉन्ट आकार: .9em; } .btnLogout {float: right; } .btnViewList {float: left; } .btn खोज {बाएं: -33%; }
यह मेरी एचटीएमएल और सीएसएस है और मैं मध्य बीटीएन खोज बटन को केंद्र में रखना चाहता हूं लेकिन मुझे मीडिया प्रश्नों के साथ हर स्क्रीन आकार के बाएं प्रतिशत को सेट नहीं करना है।
आप text-align: center
का उपयोग कर सकते हैं डिब्बे से कंटेनर और float
को हटा दें, जिसे आप केंद्रित करना चाहते हैं।
.centerbuttons {width: 50%; मार्जिन: 0 ऑटो; पाठ संरेखित करें: केंद्र; } .add_nav_header {display: inline-block; चौड़ाई: 100%; सीमा नीचे: 1px ठोस # सीसीसी; पैडिंग-नीचे: .5 एएम; } .smallBtn {/ * फ्लोट: सही; * / मार्जिन: .3 ईएम; पैडिंग: .6म; फ़ॉन्ट आकार: .9em; प्रदर्शन: इनलाइन-ब्लॉक; } .btnLogout {float: left; } .btnViewList {float: right; } / * .btn खोज {बाएं: -33%; } * /
बेला:
Comments
Post a Comment