Sizing - Campo UI

Material UI

Sizing

Format

.width-{25,50,75,100}
.width-100vw
.max-width-100
.max-width-100vw
.min-width-0
.min-width-100
.min-width-100vw
.height-{25,50,75,100}
.height-100vh
.max-height-100
.max-height-100vh
.min-height-0
.min-height-100
.min-height-100vh

Example

25%

50%

75%

100%

<div class="display-flex gap-3" style="height: 200px;">
  <div class="height-25 background-primary">
    25%
  </div>
  <div class="height-50 background-primary">
    50%
  </div>
  <div class="height-75 background-primary">
    75%
  </div>
  <div class="height-100 background-primary">
    100%
  </div>
</div>