Нужна помощь с разметкой bootstrap-?

Всем привет, недавно начал изучать bootstrap и столкнулся с проблемой.
Нарисовал в пейнте картинку, что нужно сделать. В гугле ничего не нашлось (хотя скорее всего плохо искал).
5a4c004ccc07e835575139.png
В общем дано: четыре полоски, в каждой 1 колонка (иконка), затем 6 колонок (текст), затем 2 пустые колонки, и 3 колонки - изображение, которое в высоту занимает все 4 полоски. Вопрос вероятно очень нубский, но я не нашел примера для такой сетки в документации Bootstrap.
Префикс класса буду использовать col-xs, т.к. такая разметка должна отображаться на всех устройствах.
  • Вопрос задан
  • 337 просмотров
Решения вопроса 1
SilenceOfWinter
@SilenceOfWinter
та еще зажигалка...
подобные задачи решаются через вложенные row
<div class="row">
	<div class="col-9">
		<div class="row">
			<!-- Строка 1 -->
			<div class="col-2">1</div>
			<div class="col-6">6</div>
			<div class="col-2">1</div>
			<div class="col-2">1</div>
			<!-- Строка 2 -->
			<div class="col-2">1</div>
			<div class="col-6">6</div>
			<div class="col-2">1</div>
			<div class="col-2">1</div>
			<!-- Строка 3 -->
			<div class="col-2">1</div>
			<div class="col-6">6</div>
			<div class="col-2">1</div>
			<div class="col-2">1</div>
			<!-- Строка 4 -->
			<div class="col-2">1</div>
			<div class="col-6">6</div>
			<div class="col-2">1</div>
			<div class="col-2">1</div>
		</div>
	</div>
	<div class="col-3">
		<!-- картинка 3х4 -->
		<img class="h-100">
	</div>
</div>

зачем отступы тебе я так и не понял
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@Markusan
Я тоже недавно начал изучать) Вроде что то получилось... Но я думаю это можно реализовать грамотнее.
jsfiddle
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы