I am using a Vue component and am completely new to this JavaScript framework. I have a problem where in I want to set padding according to page dimensions.

padding: 12px 50px 12px 0px;  // This is dimension at 768(Both width & height)

padding: 12px 12px 12px 0px;  // This is dimension for normal web page

This image is set at padding: 12px 12px 12px 0px; and page dimension is at 768(Toggle device)

What i need In the case of the Normal dimension, everything all labels and input fields are coming horizontally.

CodePudding user response：

as per your image of result, i suggest remove all element padding and put all element into main div and then set padding to main div as,

<div  style="padding:12px 12px 12px 0px">
 <!--here all element like label,para,div--->
</div>