@cryptic-css/prop-mid

Adds support for custom prop mid which will apply the common middle positioning technique:

top: 50%;
left: 50%;
transform: translate(-50%, -50%);

Usage

Live Editor
Result
top: 50%;
left: 50%;
transform: translate(-50%, -50%);

Configuration

The plugin included in the ccss package pre-configured. Skip this step if you don't need custom configuration and/or CCSS instance.

import { createCCSS, createOptions } from '@cryptic-css/core'
import applyPropMid from '@cryptic-css/prop-mid'
const options = createOptions()
applyPropMid(options)
const ccss = createCCSS(options)