CSS Layout Methods

Box Model

.------------------------------------------.
|  Margin                                  |
|                                          |
|      .----------------------------.      |
|      |      Border                |      |
|      |    .------------------.    |      |
|      |    |   Padding        |    |      |
|      |    |                  |    |      |
|      |    |    .---------.   |    |      | 
|      |    |    | Content |   |    |      |
|      |    |    .---------.   |    |      |
|      |    |                  |    |      |
|      |    .------------------.    |      |
|      .----------------------------.      |
.------------------------------------------.
div {
    margin: <margin-top> <margin-right> <margin-bottom> <margin-left>;
    margin: <top-bottom> <right-left>;
    margin: <all>;
    border: <border-width> <border-color> <border-style>;
    padding: (see margin);
    box-sizing: content-box (default) | border-box;
}
div {
    box-sizing: content-box (default) | border-box;
    width: 200px;
}

Box Alignment Mode

writing-mode

display contents