CSS Spacing Classes
There are CSS classes supplied by Quasar to help you with spacing for DOM elements or components.
Syntax
q-[p|m][t|r|b|l|a|x|y]-[none|auto|xs|sm|md|lg|xl] |
Examples
<!-- small padding in all directions --> |
Flex Addons
v0.17.6+
When enabled (through quasar.conf > framework > cssAddon: true
) it provides breakpoint aware versions for all spacing related CSS classes.
Note that there will be a noticeable bump in CSS footprint when enabling it. So only do it if you really need it.
.q-(p|m)(t|r|b|l|a|x|y)-<bp>-(none|auto|xs|sm|md|lg|xl) |
Examples: q-pa-xs q-pa-sm-sm q-px-md-lg q-py-md-md
See more details about the Flex Addons