I’d like to know why I get extra padding in my box if I add a paragraph inside my div. Whereas placing my content directly inside a div shows no padding by default.
Take for instance the code below:
<!DOCTYPE html>
<head>
<style>
div{border: 5px solid darkblue;}
</style>
</head>
<body >
<div>This box has no padding</div>
<div>
<p>This other box contains a paragraph and has intrinsic padding <p> </div>
</body>
</html>
I’d like to understand why placing my content in a paragraph inside a div throws in some default padding and how I can remove this padding.