@udzumaki

CSS grid ненормально работает в ie10?

Когда добавлял кроссбраузерность на сайт столкнулся с проблемой. IE налаживает (или просто не отображает) элементы таблицы которые идут до последнего и последний отображает.

Вот как сетка должна выглядеть
5d7939bc254a2919865771.png

Вот как выглядит
5d793a027a763062641462.png

Вот код
<section class="all_works">
		<div class="container">
			<h3 class="all_works--title">lorem</h3>
			<section class="all_works--works">
				<div class="all_works--work" style="background-image: url(https://bit.ly/2lYQOk3);"></div>
				<div class="all_works--work" style="background-image: url(https://cdn.pixabay.com/photo/2019/07/29/16/13/bald-eagle-4370916__340.jpg);"></div>
				<div class="all_works--work" style="background-image: url(https://cdn.pixabay.com/photo/2019/06/21/14/09/coffe-4289545__340.jpg);"></div>
				<div class="all_works--work" style="background-image: url(https://cdn.pixabay.com/photo/2019/09/06/11/27/spaghetti-4456186__340.jpg);"></div>
				<div class="all_works--work" style="background-image: url(https://cdn.pixabay.com/photo/2019/09/07/16/14/strommast-4459235__340.jpg);"></div>
				<div class="all_works--work" style="background-image: url(https://cdn.pixabay.com/photo/2019/09/08/14/26/dunes-4461128__340.jpg);"></div>
			</section>
		</div>
	</section>

.container {
	margin: 0 10%;
}

.all_works--works {
	margin: -15px -15px;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr 1fr 1fr;
	grid-template-columns: 1fr 1fr 1fr;
}

.all_works--work {
	margin: 15px 15px;
	height: 300px;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #fff;
}


grid-gap не задавал по понятным причинам, вместо этого шаманил с минусовыми маржинами. Я просто не могу понять почему ие не хочет делать 3 колонки.

Не поможете разобраться в чем дело? Буду очень благодарен.
  • Вопрос задан
  • 413 просмотров
Решения вопроса 1
CSS Grid - достаточно новая технология.
В Internet Explorer 10 есть проблемы с поддержкой CSS Grid.
Данный браузер поддерживает только предыдущую (устаревшую) версию спецификации CSS Grid.
Подтверждение этому есть на сайте Caniuse
Потому у Вас и не работает

P.S. Если у Вас сетка такая, как на фото, её вроде без особых проблем можно заменить например, на Flexbox. Он более-менее поддерживается в IE 10. Но вот в IE 9 уже не работает
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
SMMplanner Москва
от 100 000 до 150 000 руб.
Стер 23 Москва
от 110 000 до 140 000 руб.
Design, Code and Robots Санкт-Петербург
от 50 000 до 80 000 руб.