---
layout: pattern
title: Autobot
description: |
  A centering technique where an element pushes equally from all edges of a flex
  container. Best for quick centering for single items only.
  <br><br>
  See the full article for many more details about this
  technique and when it's efficient.
  <br><br>
  <a href="/centering-in-css/">Full article</a> · <a href="https://www.youtube.com/watch?v=ncYzTvEMCyE">Video on YouTube</a> · <a href="https://github.com/argyleink/gui-challenges/tree/main/centering">Source on Github</a>
date: 2022-06-01
height: 300
---

A centering technique where an element pushes equally from all edges of a flex
container. Best for quick centering for single items only.

See the full article for many more details about this
technique and when it's efficient.

<a href="/centering-in-css/">Full article</a> · <a href="https://www.youtube.com/watch?v=ncYzTvEMCyE">Video on YouTube</a> · <a href="https://github.com/argyleink/gui-challenges/tree/main/centering">Source on Github</a>
