html { margin: 0; padding: 0; height: 100%; } body { color: #3d3d3d; padding: 0; margin: auto; min-height: 100%; display: grid; grid-template-rows: 2fr auto 1fr; } header, footer { background-color: #3d3d3d; color: #ddd; padding: 1em; text-align: center; } header { grid-row-start: 1; grid-row-end: 2; } footer { grid-row-start: 3; grid-row-end: 4; } .login { margin: 1em auto 0; min-height: 80vh; } .textarea { text-align: center; margin: 1em auto 0; width: 100%; height: 100%; } header form { display: inline-block; } textarea, main { outline: none; width: 90%; height:80vh; border: none; resize: none; } main { padding: 1em; } .post-buttons { background-color: #3d3d3d; color: #ddd; padding: 1em; } .action-button { background: none; color: inherit; border: none; padding: 0; font: inherit; cursor: pointer; outline: inherit; text-decoration: none; } .disabled { background-color: #999; color: #000; } .password-reset { width: 100%; margin-bottom: 1em; } #settings section:nth-of-type(even) { margin-top: 1em; border-top: 1px solid #999; padding-top: 1em; }