Может вы путаете выход контейнера за рамки, а не ячейки? Там у контейнера стоит фиксированная ширина, а jsfiddle вроде как на ширину экрана подгоняет свои окна и контейнер туда мог просто не поместиться.
Я вроде как разгадал механизм работы. Если не задавать никакой ширины то ячейки примут оптимальную ширину (OCW), то есть весь инлайн идёт в одну строчку, но это не MCW, который максмально компактно ужимает контент. Факт в том что процентная ширина высчитывается исходя не из размеров родителя, а из OCW с какой-то специальной формулой, насколько я это вижу.
Ширина 50% у одной ячейки или 0% у обеих = 100% OCW.
Ширина 0% и более у одной >= MCW. Ширина ниже 50% увеличивает ширину соседней ячейки на ровно такое же количество которое убавили от 50, при этом надо учитывать что берётся процент от OCW. Допустим левая 40%, значит правая теперь 60% OCW, хотя это и не прописано в её свойствах. Вопрос лишь в формуле рассчёта этого процента, потому что он явно не такой простой, до 80% рост вообще никакой, а после сразу очень резкий. И вот как только мнимая обёртка display: table; по ширине достигает ширины контейнера эти ячейки начинают вести себя как положено.
И это только вариант когда я изменяю ширину одной ячейки.
Можешь проверить, поставь у обеих ячеек ширину 2%, их ширина никак не зависит от контейнера. А потом обе ширины можно увеличивать вполть до 50% пока обе ячейки не примут размеры OCW. После 50% произойдёт магия, получается что левая ячейка растёт и так, а правая добавляет ей в размерах, исходя из правила выше. То есть тот кто левее и будет расти в первую очередь, если размеры мнимой табличной обёртки превышают размеры контейнера.
Сделал пример со сравнением фактических процентов и тех, что получаются в непомещающихся ячейках, плюс MCW для примера. Ясности всё-равно нет :) jsfiddle.net/CyberAP/NUHTk/21/
Тут точно замешана MCW, но ещё и каким-то странным образом влияет фактическая ширина ячейки. Даже когда не хватает места браузер всё-равно пытается как-то укоплектовать контент и тут как раз видно что фактическая ширина левой ячейки тоже влияет на увеличение правой. jsfiddle.net/CyberAP/NUHTk/17/
Да, меня тоже немного напрягло что в CSS 2.1 всё не так досконально прописано и даже IE умудряется выдать хороший результат.
Table-layout: fixed; конечно пуленепробиваемый вариант, но слишком скучный, с ним особо непоэкспериментируешь :)
Кстати, если в твоём примере убрать max-width и посмотреть на вариант с шириной 10 и 5 % то правый блок себя вообще ведёт непонятно как.
У меня эта магия вроде и с Win 7 прокатывала. Ключевым звеном иногда является запуск VST-хоста от администратора. Описал давно ещё на английском, если что-то не будет понятно отвечу на все вопросы :)
У меня современная аудюшка-то даже не знает про буфер в 32 семпла, так что те старые процессоры делали на года. Ей вроде лет 10 уже как минимум с момента производства. Конечно, не без магии установки под win 8, но зато все работает.
Ширина 50% у одной ячейки или 0% у обеих = 100% OCW.
Ширина 0% и более у одной >= MCW.
Ширина ниже 50% увеличивает ширину соседней ячейки на ровно такое же количество которое убавили от 50, при этом надо учитывать что берётся процент от OCW. Допустим левая 40%, значит правая теперь 60% OCW, хотя это и не прописано в её свойствах. Вопрос лишь в формуле рассчёта этого процента, потому что он явно не такой простой, до 80% рост вообще никакой, а после сразу очень резкий. И вот как только мнимая обёртка display: table; по ширине достигает ширины контейнера эти ячейки начинают вести себя как положено.
И это только вариант когда я изменяю ширину одной ячейки.
Можешь проверить, поставь у обеих ячеек ширину 2%, их ширина никак не зависит от контейнера. А потом обе ширины можно увеличивать вполть до 50% пока обе ячейки не примут размеры OCW. После 50% произойдёт магия, получается что левая ячейка растёт и так, а правая добавляет ей в размерах, исходя из правила выше. То есть тот кто левее и будет расти в первую очередь, если размеры мнимой табличной обёртки превышают размеры контейнера.
jsfiddle.net/CyberAP/NUHTk/21/
jsfiddle.net/CyberAP/NUHTk/17/
Table-layout: fixed; конечно пуленепробиваемый вариант, но слишком скучный, с ним особо непоэкспериментируешь :)
Кстати, если в твоём примере убрать max-width и посмотреть на вариант с шириной 10 и 5 % то правый блок себя вообще ведёт непонятно как.
github.com/kxproject/kX-Audio-driver-binaries
www.hardwareheaven.com/general-discussion/218997-kx-drivers-windows-8-working.html#post1472806