FireFox 3 колонка css3 не работает, работает в Chrome и Safari

0

На данный момент я работаю с последними версиями браузеров. Я пытаюсь создать раскладку из трех столбцов, используя свойство column CSS.

Кажется, что он отлично работает везде, кроме FF.

Вот мой код:

.row {
  -webkit-column-count: 3;
  -webkit-column-gap: 5px;
  -webkit-column-fill: auto;
  -moz-column-count: 3;
  -moz-column-gap: 5px;
  -moz-column-fill: auto;
  column-count: 3;
  column-gap: 5px;
  column-fill: auto;
}
.item {
  background: #F00;
  height: 200px;
}
<div class="row">
  <div class="item"></div>
  <div class="item"></div>
</div>

Я также получаю эти ошибки CSS, зарегистрированные в FF.

Неизвестные свойства "столбцы". Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10876 Неизвестное свойство 'column-count'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10877 Неизвестный объект 'column-gap'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10878 Неизвестное свойство 'column-width'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10879 Неизвестное свойство 'column-fill'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10880 Неизвестное свойство '-moz-column-break-inside'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10887 Неизвестное свойство 'column-break-inside'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10888 Неизвестные свойства 'column'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10912 Неизвестное свойство 'column-count'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10913 Неизвестный объект "column-gap". Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10914 Неизвестное свойство 'column-fill'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10915 Неизвестные свойства 'columns'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10929 Неизвестное свойство 'column-count'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10930 Неизвестная собственность 'column-gap'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10931 Неизвестное свойство 'column-fill'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10932 Неизвестные свойства 'columns'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10948 Неизвестное свойство 'column-count'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10949 Неизвестный объект 'column-gap'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10950 Неизвестное свойство 'column-fill'. Декларация опустилась. 63f26845e7f429a90b8ae649031e4a073ade7260.css: 10951, мутирующий [[Prototype]] объекта, заставит ваш код работать очень медленно; вместо этого создайте объект с правильным исходным значением [[Prototype]], используя Object.create meteor.js: 532 "BookingsController slug" "VBS" router.js: 156 "BookingsController slug" "VBS" router.js: 156 "bookingProfile properties "Массив [Object, Object, Object, Object, Object] profile.js: 5 Ошибка в анализируемом значении для фона. Декларация опустилась. VBS

Что с этим?

Теги:
firefox
multiple-columns

1 ответ

0
Лучший ответ

Использование: -moz-column-fill: сбалансированный; Вместо: -moz-column-fill: auto;

Благодаря... -moz-column-fill: автоматическое разбиение столбцов CSS в Firefox

Ещё вопросы

Сообщество Overcoder
Наверх
Меню