I am giving top-margin:40px
to a <div>
element which has <p>
nested in it.
But its taking some extra margin an extra space and the body margin is set is zero. See I couldn't where is this coming from.
I am guessing that <p>
element has its default top and bottom margins when I set them to zero no extra comes up on the top margin of div.
So the div is moving because of margin of <p>
is there's any way I stop movement of <div>
while applying margin to <p>
element.
See here's my code
<style>
body{
margin:0px;
}
p{
color:white;
font-size:76px;
text-align:center;
letter-spacing:14px;
font-weight:600;
text-shadow:15px 5px 15px white;
}
.con3{
height:400px;
background-color:black;
margin-top:50px;
}
</style>
<body>
<div class="con3"> <p>HELLO </p></div>
</body>