Как создать сетку с одним стилем?

Мне нужна простая сетка, два столбца и неопределенное количество строк. Можно ли сделать это с помощью одного стиля css? Я знаю, как сделать это с одним для левого столбца, а другой для права, но я действительно хочу знать, как и как это можно сделать с одним стилем, поскольку идея заключается в том, что когда я добавляю другую запись, она автоматически перемещается до следующей «ячейки», , Например, содержание A1 становится B1, B1 становится A2 и т. Д.Как создать сетку с одним стилем?

Tnx!

источник

2013-12-19 Aleks

вы могли бы разместить изображение здесь – Selvamani

использование п-го ребенка (даже) и п-й ребенок (нечетные) – vals

нет, моя репутация слишком мала, чтобы получить возможность отправлять изображения ... вот простой код для конечного результата:

A1	B1
A2	B2

– Aleks

Стол неправильный, чтобы использовать здесь. Ячейки таблицы не могут перейти к следующей строке. Вместо этого используйте divs, которые либо плавают, либо устанавливаются на display: inline-block; с шириной, близкой к 50%. Таким образом, они будут сидеть бок о бок и складываться в ряд, когда вы добавите больше.

Вот простой пример:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<style media="all"> 
* {margin:0; padding: 0;} 
*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} 
.wrap {width: 80%; overflow: hidden; background: #f7f7f7; padding: 20px; margin: 20px auto;} 
.wrap div {min-height: 200px; width: 48%; display: inline-block; padding: 20px; background: #e7e7e7; margin-bottom: 5px;} 

</style> 
</head> 
<body> 
<div class="wrap"> 
    <div>3</div> 
    <div>2</div> 
    <div>1</div> 
</div> 

</body> 
</html>

источник

2013-12-19 13:29:38

стол был просто для иллюстрации примера. Thanx Ralph, это была именно то, что я искал! – Aleks

Ральф, когда я заполняю divs рисунком и текстом, те с правой стороны сдвигаются вниз по сравнению с теми, которые находятся слева, если у меня нет одинакового количества текста. Я попытался выровнять его с фиксированной высотой, но он не отвечает? – Aleks

решена с добавлением выравнивания по вертикали: text-top – Aleks

Как создать сетку с одним стилем?

ответ

Смежные вопросы