Здраствуйте,
я начинаю изучать фронт-енд и в рамах самопроверки делаю задания. Столкнулся с такой проблемой, вкратции надо разместить елементы, как указано на рисунке. Прошу какой-то подсказки как бы мог я это сделать. Думаю использовать nth-child() селектор, но не понимаю как правильно сделать. Заранее спасибо.
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="zad1.css" type="text/css"/>
</head>
<body>
<ul>
<li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li>
<li>7</li><li>8</li><li>9</li><li>10</li><li>11</li><li>12</li>
</ul>
<p>Sample description</p>
</body>
</html>
ul:after {
display:block;
height:0;
content:’’;
clear:both;
}
li:nth-of-type(odd) {
height: 50px;
width: 50px;
text-align: center;
background-color: rgb(255, 250, 0);
}
p{
background-color: rgb(173, 216, 230);
}