#remove { float: right; } #neu { /*Form über list*/ width: 100%; } #list { display: inline-flex; flex-direction: column; margin-top: 1em; width: 95%; max-width: 30em; } .list_row { /* einzelne Reihen */ display: flex; flex-direction: row; min-height: 24px; margin-bottom: .1em; color: #ffffff; align-items: center; border-radius: 5px; } .list_row_count { width: 6em; } #list_row_count_input { display: flex; flex-direction: row; } #list_row_anzahl_input { width: 2.5em; margin-right: .1em; } #list_row_einheit_input { width: 2.7em; margin-right: .1em; } #list font { padding-right: 1em; } #list .new { height: 24px; font-size: 16px; display: flex; align-items: center; justify-content: flex-start; margin: 0; } #nameField { border: 1px solid #ddd; height: 90%; width: 70%; } #add { -webkit-appearance: none; border: none; color: white; font-size: 16px; font-weight: 800; background-color: #5f5f5f; padding: .1em .8em; margin-left: .2em; width: 20%; height: 100%; } .checked { background-color: #4CAF50; } #saved, #error { pointer-events: none; position: fixed; display: flex; justify-content: center; bottom: 2%; margin: 0; left: 0; width: 100%; } #saved font, #error font { color: #ffffff; background-color: #000000; padding: .1em .5em .2em; border-radius: 50px; opacity: 0; } #error font { padding: .1em 1em .2em; } @keyframes fade { 0% { opacity: 0; } 10% { opacity: 1; } }