height components

how is it possible to change the height of the components (input type with label stacked or the rows of a table), property type “small” in bootstrap?

Not like in bootstrap. Use inspector to see the styles (or CSS variables) you need to change.

could you give me an example, taking as a basis the component: Form Inputs-> Full Layout / Stacked Labels. bring the height from 63px (if I have not read the inspector wrong) to 40px label and input included, and where to enter as a global setting.

Thank you.

It’s 67 pixels not 63. There is a 8 pixel padding on the top and bottom (bottom looks like it is ignored). Most of the inputs are 44 pixels in height, not including the label.

You can override it in your app.css file. Keep in mind that this will change ALL the inputs, so you will need to find the parent div’s too):

.ios{
    --f7-input-height: 25px; //stacked label is 15px
}

thank you very much, both for time and for your patience

1 Like