How to realize the layout that is automatically covered with auto, on one side of width and on the other side?

clipboard.png

how to achieve a layout in which the text on the left can be long or short, and the right side is automatically covered with the remaining width,?

Aug.16,2021

flex elastic layout


it is also possible to use table layouts, table-layout: auto.

.wrapper{
  display: table;
  table-layout: auto;
}
.wrapper > .row{
  display: table-row;
}
.wrapper > .row > .cell{
  display: table-cell;
}

.cell > input{
  width: 100%;
}

I have written it. You can refer to streaming layout


need to set flex-grow:1; with the remaining width elements

Menu