2012-12-01 15 views
8

मैं ऊंचाई सेट:एचटीएमएल इनपुट और अलग ऊंचाई का चयन

input,select{height: 20px;} 

लेकिन ब्राउज़र में यह ऊंचाई input : 20px और select 18px है, मुझे पता है क्यों क्योंकि इनपुट से पहले और चुनें reseted था न। अगर मैं <!DOCTYPE html> हटा देता हूं तो ठीक है, लेकिन फिर IE पृष्ठ को केंद्रित नहीं करता है।

+0

समीक्षा: http://stackoverflow.com/questions/10001291/aligning-text-and-select-boxes-to-the-same-width-in-css – alditis

+1

http://stackoverflow.com/questions/9767612/मुद्दा-साथ-इनपुट-चयन-टैग-ऊंचाई-इन-फॉर्म – Vucko

+0

@Vucko धन्यवाद, शायद आप डिफ़ॉल्ट सीमा रंग जानते हैं? ? – Wizard

उत्तर

10

यह border-box करने के लिए अपने तत्वों की box-sizing संपत्ति की स्थापना द्वारा सुधारा जा सकता है: moz- या webkit- तरह

input, select{ 
    box-sizing: border-box; 
} 

विक्रेता विशिष्ट उपसर्ग लागू हो सकता है।

+0

मैन, मैं इसे 10 मिनट के लिए देख रहा हूं। मेरे दिन के सबसे खराब 10 मिनट! – Bitterblue

2

मैं अपने SELECT की ऊंचाई को आईई 8 और 9 में जो चाहता था, उसे सेट करने में सक्षम था। चाल box-sizing संपत्ति content-box पर सेट करने के लिए है। ऐसा करने से SELECT की सामग्री क्षेत्र ऊंचाई पर सेट हो जाएगा, लेकिन ध्यान रखें कि margin, border और padding मानों की गणना SELECT की चौड़ाई/ऊंचाई में नहीं की जाएगी, इसलिए तदनुसार उन मानों को समायोजित करें।

select { 
    display: block; 
    padding: 6px 4px; 
    -moz-box-sizing: content-box; 
    -webkit-box-sizing:content-box; 
    box-sizing:content-box; 
    height: 15px; 
} 

यहां एक काम कर रहे jsFiddle है। क्या आप उचित उत्तर की पुष्टि और अंकन करना चाहते हैं?

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