Два деления подряд. левый увеличивается до доступного пространства, когда правый меняет размер

Question

Два деления подряд. левый увеличивается до доступного пространства, когда правый меняет размер

0

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

Я построил пример html, с которым я хочу работать (divs являются интерактивными): http://jsbin.com/anaPIJe/3/edit?html,css,output

Лучшее решение изменило бы код jsbin, чтобы он работал так, как я предполагаю.

Благодарю!

UPDATE My Fault, я не упоминал, что хочу только решение CSS

Ben 13 нояб. 2013, в 09:07

Источник

Теги:

html

css

css3

3 ответа

0

Я немного изменил CSS и JavaScript, чтобы он работал.

Вы можете посмотреть новый код здесь: JSBin

Я вычитал 2 из каждой ширины из-за невидимых границ, которые размещаются вокруг divs

Bjorn Smeets 13 нояб. 2013, в 06:28

0

Благодарю. Я забыл упомянуть, что я хочу решение только для CSS. моя вина.
Ben 13 нояб. 2013, в 08:31

0

Попробуй это.

#container {
    display: table-row;
}
.inner {
    display:table-cell;
}

Демо здесь.

Hiral 13 нояб. 2013, в 06:24

0

В вашей демонстрации желтый не изменяется в размере, когда меняется красный.
Ben 13 нояб. 2013, в 08:32
0

@Ben Это меняется. глянь сюда.
Hiral 13 нояб. 2013, в 08:37
0

Это не для меня. Какой браузер вы используете?
Ben 13 нояб. 2013, в 08:57

Показать ещё 1 комментарий

Ещё вопросы

Благодарю. Я забыл упомянуть, что я хочу решение только для CSS. моя вина.
В вашей демонстрации желтый не изменяется в размере, когда меняется красный.
Это не для меня. Какой браузер вы используете?

Andrew · Accepted Answer · 2013-11-13T06-28-00.000Z

Попробуйте css3 flex box,

http://jsbin.com/anaPIJe/9/

#container {
   display: flex;
   ...

#one {
   flex: 1;
   ....