I've been doing a simple project when I saw that my background is doing something quite strange and something I've never seen before. The background that I set to body tag applies only to the div inside and then repeats itself. What is even weirder is that the border that I set to body tag appears around the div element that is inside. Here's the code
*{
margin:0;
padding:0;
box-sizing: border-box;
font-family: Helvetica;
}
body{
background: linear-gradient(317deg, rgba(49,92,161,1) 0%, rgba(106,179,255,1) 100%);
color:white;
}
height:100%;
#centar h2{
font-size:3em;
}
#centar{
text-align: center;
display: flex;
flex-direction: column;
margin-top:20%;
}
#centar input{
width:30%;
} <div id="centar">
<h2>Unesite dužinu prečnika:</h2>
<input type="text" placeholder="Unesite dužinu prečnika"/>
</div>
