I know you can do media queries in the css, but how do I specify that I need H3 in XL and H6 in XS using the PG UI?
Headings 1–6 are not actually about visual size, but hierarchy in the structure of the HTML and content flow.
Unless you are talking about this option here for heading size?
Many Bootstrap classes support responsive breakpoint variants, but some do not. If you want precise control over heading sizes at different breakpoints, you would typically either:
-
Create custom classes
-
Apply CSS to your heading elements using media queries, eg h3 tag or .h3 class making it smaller on the XS breakpoint.
The later, being the easier option for project wide.
Bootstrap classes in the Elements Property panel that support breakpoint variants have breakpoints showing.
1 Like