Package Exports

postcss-place
postcss-place/dist/index.cjs
postcss-place/dist/index.mjs

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (postcss-place) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

PostCSS Place Properties

PostCSS Place Properties lets you use place-* properties as shorthands for align-* and justify-*, following the CSS Box Alignment specification.

.example {
  place-self: center;
  place-content: space-between center;
}

/* becomes */

.example {
  align-self: center;
  justify-self: center;
  place-self: center;
  align-content: space-between;
  justify-content: center;
  place-content: space-between center;
}

Usage

Add PostCSS Place Properties to your project:

npm install postcss postcss-place --save-dev

Use it as a PostCSS plugin:

import postcss from 'postcss';
import postcssPlace from 'postcss-place';

postcss([
  postcssPlace(/* pluginOptions */)
]).process(YOUR_CSS /*, processOptions */);

PostCSS Place Properties runs in all Node environments, with special instructions for:

Node	Webpack	Create React App	Gulp	Grunt

Options

preserve

The preserve option determines whether the original place declaration is preserved. By default, it is preserved.

postcssPlace({ preserve: false })

.example {
  place-self: center;
  place-content: space-between center;
}

/* becomes */

.example {
  align-self: center;
  justify-self: center;
  align-content: space-between;
  justify-content: center;
}