Два дивы, статический ДИВ на левой стороне и жидкости DIV на правой стороне

Question

Вот моя ситуация:

.left { 
     float: left; 
     width: 150px; 
     height: 300px; 
     margin-right: 20px 
    } 

    .right { 
     float: right; 
     max-width: 450px; 
     height: 300px; 
    } 

Я хочу, чтобы право ДИВ быть жидкости, поэтому, когда дело доходит до уменьшения ширины браузера он должен быть по-прежнему в правой части экрана, но с меньшей шириной.

Но мой правый div довольно груб. Вместо того, чтобы делать то, что я ему говорю, он рассматривает его ширину как свой приоритет. Когда окно касается его правого края, он прыгает ниже моего бедного левого div вместо того, чтобы уменьшать его ширину.

Вы, ребята, знаете какой-либо способ наказать его? Сказать ему, что его поведение не является правильным? Чтобы он оставался с правой стороны экрана?

Спасибо за консультацию!

Answer 1

попробуйте следующее, и это должно быть то, что вы ищете.

.left { 
     float: left; 
     width: 150px; 
     height: 300px; 
     margin-right: 20px; 
     border:1px solid black; 
    } 
    .right { 
     max-width: 450px; 
     height: 300px; 
     border:1px solid black; 
     margin-left:155px; 
    } 

Если я правильно помню, поплавковые div не имеют автоматической ширины. Так как ваш левый div имеет статическую ширину, вы можете просто нажимать правый div с запасом, чтобы он очищал левый div, и он будет жидким.