The place-self shorthand sets align-self (block axis) and justify-self (inline axis) in one declaration. Overrides the parent's place-items for an individual item. Useful for per-item alignment exceptions..item {
place-self: center;
}.grid > .featured {
place-self: stretch start;
grid-row: 1 / -1;
}autoInherits from parent's place-items (default).normalContainer default.stretchItem stretches to fill the cell.startStart edge of the alignment container.endEnd edge of the alignment container.self-startFlush with the start edge of the item's own writing mode.self-endFlush with the end edge of the item's own writing mode.centerCenter.flex-startFlush with the flex container's main-start/cross-start; behaves as start outside flex.flex-endFlush with the flex container's main-end/cross-end; behaves as end outside flex.baselineBaseline alignment (equivalent to first baseline).first baselineAligns to the first baseline of the item.last baselineAligns to the last baseline of the item.safeIf the item overflows, aligns as start to avoid data loss.unsafeHonors the specified alignment even if the item overflows.leftFlush with the left edge — valid for justify-self only, not align-self.rightFlush with the right edge — valid for justify-self only, not align-self.CSS Box Alignment Module Level 3Editor's DraftW3CMDNBox 1Box 2Box 3Show all codeEdit CSS onlineThe plugin that remembers hundreds of CSS items for youEvery CSS property — in a live demonstrationThe bilingual CSS referencedefinitionexamplessyntaxmodulespecificationsourcesvisual demonstrationpreviousnext
