* { box-sizing: border-box; } html, body { height: 100%; background: @background; color: @foreground; } body { margin: 0; padding: 0; font-family: "Droid Sans"; display: flex; flex-direction: column; align-items: stretch; align-content: stretch; } a[target] { color: @foreground; } :focus { outline: @accent auto 5px; } //MACRO-LEVEL POSITIONING .toolbar { flex: 0 0 30px; width: 100%; } .tabs { flex: 0 0 32px; width: 100%; } .editor-container { flex-grow: 1; height: 100%; padding-top: 2px; } .bottom-bar { flex: 0 0 auto; align-self: flex-end; width: 100%; display: flex; justify-content: space-between; align-content: stretch; box-shadow: 0 -4px 4px rgba(0, 0, 0, .1); z-index: 99; }