В настоящее время я работаю над игрой Connect 4, где доска настроена в виде таблицы с кнопками на тд.
<table class="board">
<tr>
<td><button type="button"></button> </td>
<td><button type="button"></button> </td>
<td><button type="button"></button> </td>
<td><button type="button"></button> </td>
<td><button type="button"></button> </td>
<td><button type="button"></button> </td>
<td><button type="button"></button> </td>
</tr>
Я выяснил ответ на свой вопрос, но мне нужно знать, почему я получил ответ, который сделал.
При попытке отредактировать кнопку у меня изначально был такой CSS:
button {
height: 100px;
width: 100px;
border-radius: 50%;
margin: 1px;
border: 1px solid black;
}
Высота, ширина и граница изменились, но границы и радиус поля не изменились.
Однако, когда я изменил CSS на это:
.board button {
height: 100px;
width: 100px;
border-radius: 50%;
margin: 1px;
border: 1px solid black;
}
Все изменения произошли. Почему это случилось? И спасибо авторам.