Почему этот дивинг слишком широкий и длинный? ⇐ Html

[Anonymous]

Я заметил, что карта на экране здесь немного шире справа и внизу. Я понятия не имею, почему. Я сделал фон его родительского div классом "card-inner" желтый, так что его легче увидеть. "Card-Inner" меньше, чем Child Div I.D. «карт-фронт» . Если вы отобразите код, вы точно увидите, что левый верхний угол отлично выходит на линию, но нижняя и правая сторона слишком длинные и широкие. Эта проблема делает это так, что когда я добавляю больше divs внизу, за ним и рядом, они не выстраиваются, что странно. Я не смог определить проблему и не увидеть места, где я неправильно использовал заполнение или маржу. Мне жаль, если это вопрос новичка, так как я очень неопытный с H.T.M.L. и c.s.s .. < /p>
Это H.T.M.L. Документ: < /p>

Код: Выделить всё

и это main.css :
#everything
{
margin-left: auto;
margin-right: auto;
width: 700px;
}

#card
{
background-color: transparent;
height: 350px;
width: 700px;
padding-bottom: 10px;
}

.relative_element
{
position: relative;
display: flex;
justify-content: center;
}

.card-inner
{
width: 100%;
height: 100%;
position: relative;
background-color: yellow;
text-align: center;
}

#card-front
{
display: flex;
align-items: center;
position: absolute;
width: 100%;
height: 100%;
border-radius: 25px;
border: 2px solid blue;
justify-content: center;
background-color: white;
color: black;
font-size: 30px;
}
< /code>
Заранее спасибо.


Подробнее здесь: https://stackoverflow.com/questions/797 ... e-and-long