W3.CSS - 小型の選択入力を正確に2桁広い

Question

私はw3.cssを使用していますが、私はそうのような日付の入力があります：最初の選択ボックス（（すべてw3.css入力フィールドのように）されてはどうなり

<div class="w3-padding w3-light-grey w3-border w3-border-black w3-left-align"> 
    <span style="white-space:nowrap"> 
     Date (yyyy/mm/dd): 
     <select class="w3-select w3-border w3-hover-yellow"></select>/ 
     <select class="w3-select w3-border w3-hover-yellow"></select>/ 
     <select class="w3-select w3-border w3-hover-yellow"></select> 
    </span> 
</div> 

を年）は、divを含む全幅を占め、他のものは右側にこぼれる。

私が欲しいのは、各選択が最大4桁（年）と2桁（月と日）です。私はこれをすべての携帯電話とデスクトップに必要としています。

また、w3.css入力が含まれているdivの全幅を占めないようにするにはどうすればよいですか？

Answer 1

多くの読書の後、私はうまくいくような解決策を持っています。

style="display: inline-block; width: auto;" 

：

<div class="w3-padding w3-light-grey w3-border w3-border-black w3-left-align"> 
    <span style="white-space:nowrap"> 
     Date (yyyy/mm/dd): 
     <select class="w3-select w3-border w3-hover-yellow" style="display: inline-block; width: auto;"></select>/ 
     <select class="w3-select w3-border w3-hover-yellow" style="display: inline-block; width: auto;"></select>/ 
     <select class="w3-select w3-border w3-hover-yellow" style="display: inline-block; width: auto;"></select> 
    </span> 
</div> 

は基本的にあなたがw3-selectのスタイルの表示と幅の要素をオーバライドする必要があります。これは似た何かをする必要があり、他のお役に立てば幸いです