Here is the code I have:
<div id="app">
<v-app id="inspire">
<v-content>
<v-container>
<v-card
max-width="1000"
class="mx-auto"
>
<v-form v-model="valid">
<v-container>
<v-row>
<v-col
cols="12"
md="4"
>
<v-text-field
label="First name"
required
></v-text-field>
</v-col>
<v-col
cols="12"
md="4"
>
<v-text-field
label="Last name"
required
></v-text-field>
</v-col>
<v-col
cols="12"
md="4"
>
<v-text-field
label="E-mail"
required
></v-text-field>
</v-col>
</v-row>
</v-container>
</v-form>
</v-card>
</v-container>
</v-content>
</v-app>
</div>
You can see a demo of this code here
If you access it on a MacBook Pro, it will look like this :
https://i.sstatic.net/VzfCU.png
But if you access it on Windows, it will look like this :
https://i.sstatic.net/jtVwf.png
The width appears larger on Windows. How can I make it consistent across both platforms?
Note:
I am using a MacBook Pro 13 inch 2017 and have installed Windows on it using Bootcamp to test how it looks on both systems.