Unable to change width and height of vuejs-datepicker

Ajay picture Ajay · Sep 29, 2019 · Viewed 7.4k times · Source

I looked into this vuejs-datepicker to add datepicker to my project.

<div class="startDate">
    <datepicker
     v-model="startDate"
     format="YYYY-MM-DD"
     name="startDate"
     ></datepicker>
</div>

import datepicker from "vue-date-picker";

<style scoped>
  .startDate {
   width: 150px;
   }
<style>

But still width of startDate shows 238px which is default width of datepicker.

Answer

sid heart picture sid heart · Sep 29, 2019

try this

<div>
    <datepicker class="startDate"
        v-model="startDate"
        :readonly="true"
        format="YYYY-MM-DD"
        name="startDate"
     ></datepicker>
</div>

 .startDate {
    width: 150px;
     }