如何使用kendo-ui更改文本框的寬度？

Question

所以，我想用兩個相鄰的文本框不同的寬度，使用kendo-ui。

我的HTML：

<tr> 
    <td><input type="checkbox">1D22339</td> 
    <td>12243JNJ3427676</td> 
    <td><input type="text" class="k-input k-textbox.medium"><input type="text" class="k-input k-textbox.small"></td> 
</tr> 

我的CSS代碼：

.k-textbox.small{ 
    width: 20px; 
} 
.k-textbox.medium{ 
    width: 50px; 
} 

的問題是，這兩個文本框顯示出相同的默認大小。我該如何正確設計文本框的樣式？

謝謝！

Answer 1

試試這個，

HTML代碼：

<tr> 
     <td><input type="checkbox">1D22339</td> 
     <td>12243JNJ3427676</td> 
     <td><input type="text" class="k-input k-textboxmedium"> 
      <input type="text" class="k-input k-textboxsmall"></td> 
    </tr> 

CSS代碼：

.k-textboxsmall{ 
    width: 20px !important; 
} 
.k-textboxmedium{ 
    width: 50px !important; 
} 

我希望這是ü有用，

Answer 2

你應該喜歡它 -

input[type='text'].k-textbox.small{ 
    width: 20px; 
} 
input[type='text'].k-textbox.medium{ 
    width: 50px; 
} 

或

.k-textbox.small{ 
    width: 20px !important; 
} 
.k-textbox.medium{ 
    width: 50px !important; 
} 

希望它會幫助你。