html - करण - एचटीएमएल परिभाषित



ब्लैकबेरी में एचटीएमएल आदानों में उनके प्रकार के आधार पर अलग-अलग चौड़ाई है (1)

मैंने इस मुद्दे को इस सीएसएस को जोड़ने का हल किया है, इस उत्तर के लिए धन्यवाद और यह :

input[type=number]::-webkit-outer-spin-button,
input[type=date]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

शैलियों की width: 100%; box-sizing: border-box; साथ इनपुट width: 100%; box-sizing: border-box; width: 100%; box-sizing: border-box; ब्लैकबेरी में निम्न कोड का परीक्षण करते समय प्रकार की number या date में टाइप text वाले लोगों की तुलना में एक अलग चौड़ाई है I मैंने 9 380, 9810 और 9850 सिम्युलेटर के लिए और 9 810 डिवाइस में यह जाँच लिया है।

<style type="text/css">
    #inputsTest { 
        border: 1px solid red; 
        margin: 15px; 
    }

    #inputsTest input { 
        border: 1px solid green; 
        width: 100%; 
        -webkit-box-sizing: border-box; 
        -moz-box-sizing: border-box; 
        box-sizing: border-box; 
    }
</style>

<div id="inputsTest">
      <label for="test1">Text</label>
      <input id="test1" type="text"/>
      <label for="test2">Number</label>
      <input id="test2" type="number"/>
      <label for="test3">Date</label>
      <input id="test3" type="date"/>
</div>

यह फ़ायरफ़ॉक्स से एक स्क्रीन कैप्चर है:

और यह ब्लैकबेरी में दिखता है (चौड़ाई का अंतर लाल हलकों में दिखाई देता है):

कोड यहां भी उपलब्ध है: http://jsfiddle.net/GXfXG/5/





webkit