Помогите, пожалуйста. Уже долго пытаюсь опустить див в колонке к нижней границе td. Но они упорно центрируются по вертикали.
table.nonogram {
border-spacing: 0px;
font-size: 16px;
}
.nonogram tr {
height: 21px;
}
.nonogram td {
border: 1px solid black;
padding: 0px;
}
.nonogram div {
margin: 0px;
display: inline-block;
float: right;
width: 21px;
height: 21px;
border: 1px black solid;
text-align: center;
}
.nonogram .top-elems div {
clear: both;
}
<table class="nonogram">
<tr>
<td></td>
<td class="top-elems">
<div>1</div>
</td>
<td class="top-elems">
<div>1</div>
<div>1</div>
</td>
<td class="top-elems">
<div>3</div>
</td>
</tr>
<tr>
<td class="side-elems">
<div>2</div>
</td>
<td></td><td></td><td></td>
</tr>
<tr>
<td class="side-elems">
<div>1</div>
<div>1</div>
</td>
<td></td><td></td><td></td>
</tr>
<tr>
<td class="side-elems">
<div>2</div>
</td>
<td></td><td></td><td></td>
</tr>
</table>