.labelBox-outerDiv { width: 100%; height: 100%; border-radius: inherit; display: flex; flex-direction: column; position: relative; } .labelBox-mainButton { max-width: 100%; width: 100%; height: 100%; border-radius: inherit; //letter-spacing: 2px; // bcz: doesn't work with LabelBigText overflow: hidden; display: inline-block; margin: auto; text-overflow: ellipsis; > span { max-height: 100%; // make sure top of text is in view, otherwise it would center on middle of large text span } } .answer-icon { position: absolute; right: 8px; bottom: 5px; color: black; display: inline-block; font-size: 10px; cursor: pointer; border-radius: 50%; overflow: hidden; } .q-icon { position: absolute; right: 6px; bottom: 5px; color: white; display: inline-block; font-size: 10px; cursor: pointer; border-radius: 50%; overflow: hidden; } .edit-icon { position: absolute; right: 20px; bottom: 5px; display: inline-block; font-size: 10px; cursor: pointer; border-radius: 50%; overflow: hidden; } .labelBox-params { display: flex; flex-direction: row; } .labelBox-missingParam { width: 100%; background: lightgray; border: dimgray solid 1px; }