Доброго времени суток, прошу объяснить: почему при данном виде оформления "кнопка" получается меньше остального. Заранее спасибо за ответ.
Скрины и код ниже:
HTML:
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<div>hello, guys</div>
<p>hello,girls</p>
<input/> <br>
<button>man</button>
</body>
</html>
CSS:
div{
font-size: 20px;
border: 3px dashed black;
width: 25%;
margin: 10px;
}
p{
font-size: 20px;
border: 3px dashed red;
width: 25%;
margin: 10px;
}
input{
font-size: 20px;
border: 3px dashed red;
margin: 10px;
width: 25%;
}
button{
font-size: 20px;
border: 3px dashed red;
background-color: white;
margin: 10px;
width: 25%;
}