How to impose two blocks: one on the left, second on the right, the width of the 1st depends on the internal content, and the 2nd on the width of the 1st block?

  • In what sense is the width of the second from the first? - goodalien
  • where is your code? - Alex

1 answer 1

As far as I know, to achieve such a result with the help of css , there is only one way: using flexboxes. You must set the parent display: flex; and that of the blocks, whose width is determined by the width of another block, must be given the flex: auto; property flex: auto; .

 html, body { margin: 0; } .flex-container { display: flex; } .flex-container div { display: flex; align-items: center; height: 40px; padding: 0 15px; } .flex-container .item-title { background: #a7a7a7; } .flex-container .item-descr { flex: auto; background: #cecece; } 
 <div class="flex-container"> <div class="item-title">Наименование товара:</div> <div class="item-descr">Some product</div> </div>