flexbox center

by Nic Fontaine

HTML

<div id="parent">
    <div id="child" contenteditable="true">asdf</div>
</div>

CSS

#parent { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 200px; background: #f9f9f9; }
#child { background: #ddd; max-width: 50%; flex: 1; padding: 20px; box-sizing: border-box; }