Как разделить блок на 30px и на всё оставшееся?

#html #css

Есть блок. Нужно поделить на два. Один 30px, другой auto.




  


  
  


  





Я решил проблему так: 





    
hвавфыавправi
    
hii






Интересно посмотреть без таблиц.
    

Ответы

Ответ 1

Решение на основе плавающих блоков.
1ый блок - 30px. Второй занимает всё оставшееся пространство, так как он div (display:
block;)




     
h
     
text



Ответ 2

flex:



.right {
  width: 30px;
  flex-basis: 30px;
  flex-shrink: 0;
  background: red;
}

.left {
  flex-basis: 100%;
  flex-shrink: 1;
  background: #ccc;
}

.wrap {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}

  

      Left
  
  

  



Ответ 3



    
hвавфыавправi
    
hii