Skip to content

Instantly share code, notes, and snippets.

@lslucas

lslucas/modal.md

Created September 6, 2013 14:39
Show Gist options
  • Save lslucas/6464761 to your computer and use it in GitHub Desktop.
Save lslucas/6464761 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. lslucas created this gist Sep 6, 2013.
    19 changes: 19 additions & 0 deletions modal.md
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,19 @@
    ```css
    #modal {
    display: block;
    position: fixed;
    top: 50%;
    left: 50%;
    box-sizing: border-box;
    transform: translate(-50%, -50%);
    }
    ```

    ```html
    <div id="modal">
    <!-- YOUR CONTENT HERE (seriously, it's just one div) -->
    </div>
    ```

    Demo: http://jsfiddle.net/HUZYN/9/light/
    Source: http://www.backalleycoder.com/2012/05/31/a-modal-cure-in-pure-css-no-wrappers-no-javascript-no-bs/