postcss-pxv Test Cases

Resize the window to see how pxv values scale between --siteMin, --siteBasis, and --siteMax.

Typography

This paragraph uses our new scalable typography which seems to work perfectly with all browser zoom functionality. I'm assuming this was mosltly fixed once clamp became standard.

Box Model

Border & padding test
Shorthand padding + margin
Decimal pxv values
Zero pxv value (margin-top = 0)

Positioning

Absolutely positioned box
Negative margin-left test

Expressions

Nested calc() with pxv

Grid & Flex Layout

A
B
C
1
2
3

Pseudo-elements

This has a ::before element

Form Elements

Media Query Test

This padding changes at 1600px

Other CSS Properties

Box with radius, shadow, and translate

Selectors Variety

I am an ID selector

Article Heading

Some text here