title: resizing TelerikDateRangePicker components
body: <p>I want to resize input date boxes of TelerikDateRangePicker component in Blazor in order to fit it better in my page. It looks to be a bit long and I want to resize it. This is the original size:
  <a href="https://i.stack.imgur.com/galQI.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/galQI.png" alt="enter image description here" /></a>
  I tried adding</p>
  <pre><code>&lt;style&gt;
      .k-floating-label-container {
            width: 140px !important;
       }
  &lt;/style&gt;
  </code></pre>
  <p>to the header of the page when running which made it as follows:
  <a href="https://i.stack.imgur.com/B9Oec.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/B9Oec.png" alt="enter image description here" /></a>
  However, when I do the same in my CSS file and then run the application it goes back to the default. Any idea on this?</p>