Умное позиционирование блоков в CSS с помощью calc()

Представьте себе, что вам нужно зафиксировать какой-то блок, скажем, в самом низе веб-страницы. Для этой задачи вы скорее всего будете использовать что-то вроде этого :

.block {
    position: absolute;
    top: 100%;
}

Этот код решает проблему, но проблема возникает когда вам нужно сделать отступ снизу. Обычно для решения этой задачи, многие просто добавляют отступ, используя margin-top:

.block {
    position: absolute;
    top: 100%;
    margin-top: 10px;
}

Но в CSS3 вы можете пойти более умным путем, используя функцию calc:

.block {
    position: absolute;
    top: calc(100% + 10px);
}