Toshakins/index.html

## index.html
<!doctype html>
<html>
<head>
  <title>Calendar</title>
	<link rel="stylesheet" href="styles.css">
	<meta charset="UTF-8">
</head>
<body>
	<section>
		<div>пн</div>
		<div>вт</div>
		<div>ср</div>
		<div>чт</div>
		<div>пт</div>
		<div>сб</div>
		<div>вс</div><div></div>
		<div></div>
		<div></div>
		<div>1</div>
		<div>2</div>
		<div class="start">3</div>
		<div>4</div>
		<div>5</div><div></div>
		<div>6</div>
		<div>7</div>
		<div>8</div>
		<div>9</div>
		<div>10</div>
		<div>11</div>
		<div>12</div><div></div>
		<div>13</div>
		<div>14</div>
		<div>15</div>
		<div>16</div>
		<div class="end">17</div>
		<div>18</div>
		<div>19</div><div></div>
		<div>20</div>
		<div>21</div>
		<div>22</div>
		<div>23</div>
		<div>24</div>
		<div>25</div>
		<div>26</div><div></div>
		<div>27</div>
		<div>28</div>
		<div>29</div>
		<div>30</div>
		<div>31</div>
		<div></div>
		<div></div>
	</section>
</body>
</html>

## styles.css
section {
  border-collapse: collapse;
	display: table;
}

section > div {
	display: table-cell;
	border: 0.1em solid silver;
	background: white;
	font: bolder 100% Arial;
	font-size: small;
	padding: 0.3em 0.3em;
	text-align: right;
}

.end ~ div {
	background: white !important; /*hell*/
}

.start, .start ~ div {
	background: lavender;
}

section > div:nth-of-type(8n) {
	display: table-column;
}
	<!doctype html>
	<html>
	<head>
	<title>Calendar</title>
	<link rel="stylesheet" href="styles.css">
	<meta charset="UTF-8">
	</head>
	<body>
	<section>
	<div>пн</div>
	<div>вт</div>
	<div>ср</div>
	<div>чт</div>
	<div>пт</div>
	<div>сб</div>
	<div>вс</div><div></div>
	<div></div>
	<div></div>
	<div>1</div>
	<div>2</div>
	<div class="start">3</div>
	<div>4</div>
	<div>5</div><div></div>
	<div>6</div>
	<div>7</div>
	<div>8</div>
	<div>9</div>
	<div>10</div>
	<div>11</div>
	<div>12</div><div></div>
	<div>13</div>
	<div>14</div>
	<div>15</div>
	<div>16</div>
	<div class="end">17</div>
	<div>18</div>
	<div>19</div><div></div>
	<div>20</div>
	<div>21</div>
	<div>22</div>
	<div>23</div>
	<div>24</div>
	<div>25</div>
	<div>26</div><div></div>
	<div>27</div>
	<div>28</div>
	<div>29</div>
	<div>30</div>
	<div>31</div>
	<div></div>
	<div></div>
	</section>
	</body>
	</html>
	section {
	border-collapse: collapse;
	display: table;
	}

	section > div {
	display: table-cell;
	border: 0.1em solid silver;
	background: white;
	font: bolder 100% Arial;
	font-size: small;
	padding: 0.3em 0.3em;
	text-align: right;
	}

	.end ~ div {
	background: white !important; /hell/
	}

	.start, .start ~ div {
	background: lavender;
	}

	section > div:nth-of-type(8n) {
	display: table-column;
	}