Как составить такое выражение в css?

Question

[simka alien]

для примера

Т.е каждый первый + второй блок в обёртке имеет display:inline-block; и width:50%;
каждый блок идущий после inline-block будет width:100%; и потом опять два в inline-block и следующий width:100%; ?
масонри не интересует

Answer 1

[Дмитрий]

:nth-child() смотрите, за 10 минут все решается

Comments

[simka alien]

это же блоков то несканчаемое кол-во , я думал про odd и even ... пример из яндэкс-дзен взят

Answer 2

[Ivan Bogachev]

У вас на картинке 2 раза по 50% и 2 раза по 100%, можно сделать как-нибудь так:

div {
    display: inline-block;
    float: left;
    width: 50%;
}

div:nth-of-type(4n),
div:nth-of-type(4n-1) {
    width: 100%;
}

Answer 3

[Alex Ander]

<style>
.ex>div{width:50%;display:inline-block}
.ex>div:nth-child(3n){width:100%}
</style>
<div class="ex">
	<div>50</div><div>50</div>
	<div>100</div>
	<div>50</div><div>50</div>
	<div>100</div>
	<div>50</div><div>50</div>
	<div>100</div>
	<div>50</div><div>50</div>
	<div>100</div>
</div>