IE (11) неправильне поводження з декількома стовпцями CSS? - css, Internet-Explorer, кілька стовпців

Я будую макет з 2 стовпцями з використанням декількох стовпців CSS.

Тому я кажу: columns: 2 на контейнері, і break-before: column на дитину, де я хочу перерву.

IE (11 у моєму випадку) вирішує розділити мій вміст на 3 колонки і переповнюється праворуч від його вікна :-(

Chrome (використовуючи попередні альтернативи -webkit-columns:2 і -webkit-column-break-before: always) веде себе добре.

Скринька на: http://jsfiddle.net/jDecq/6/

Я роблю щось неправильно?

Чи є це неправильним поведінкою IE?

Будь-які пропозиції щодо обхідних шляхів?

Відповіді:

Оскільки я сам дуже зацікавлений у цьому питанні, я вивчив специфікацію та деякі приклади багатоколонових макетів.

Спочатку я повинен сказати, що специфіка є жахливо "неточним"!
Але здається, що будь-яке визначення прориву має перевагу над column-count значення (хоча я не міг знайти його явно в специфікації або де-небудь ще).

Це відбувається тільки в тому випадку, якщо, за даними мульти-стовпця псевдоалгоритм, відповідний елемент, який задає точку розриву, вже є частиною останнього стовпця (як у прикладі скрипки).

Приклад надано @GCyrillus (див. коментарі на запитання)просто працює, оскільки налаштування висоти змушує алгоритм спочатку заповнити задану висоту, перш ніж додаткові поля стовпців створюються у вбудованому напрямку.
Ви можете побачити "оригінальний" ефект, якщо ви зміните висоту від 20em до 10em!

Отже, зрештою, я схильний говорити, що це не помилка, і IE веде себе правильно.

Принаймні, це може бути помилка або недолікалгоритм декількох стовпців, щоб не перераховувати або поповнювати стовпці таким чином, щоб, незважаючи на будь-які перерви, дотримувалося значення лічильника стовпців. Логічно це можна зробити тільки до тих пір, поки кількість визначених точок розриву не перевищує значення лічильника стовпців.

Насправді IE 10+ є єдиним браузером, що підтримуємодуль з кількома стовпцями, включаючи властивості break-xy, важко визначити, чи є поведінка правильною чи неправильною, і як інші браузери зроблять це в майбутньому!

Наразі я рекомендую не використовувати ці властивості взагалі.