#label-handler { display: flex; flex-direction: column; align-items: center; > div:first-child { display: flex; // Puts the input and button on the same row align-items: center; // Vertically centers items in the flex container input { color: black; } .IconButton { margin-left: 8px; // Adds space between the input and the icon button width: 19px; } } > div:not(:first-of-type) { display: flex; flex-direction: column; align-items: center; // Centers the content vertically in the flex container width: 100%; > div { display: flex; justify-content: space-between; // Puts the content and delete button on opposite ends align-items: center; width: 100%; margin-top: 8px; // Adds space between label rows p { text-align: center; // Centers the text of the paragraph flex-grow: 1; // Allows the paragraph to grow and occupy the available space } .IconButton { // Styling for the delete button margin-left: auto; // Pushes the button to the far right } } } }