I created a web page with 3 div tags with some content in each div and with background colors set to the div elements I found some white space appearing between the div elements.
I have tried a lot to remove these white space using various properties like outline
, margin
, padding
etc, but I failed.
I want to remove white spaces between my div
without using 'float' property.
webpage snapshot
<!DOCTYPE html>
<html>
<head>
<style>
body
{
margin:0px;
background-color:green;
}
.container
{
margin-top:0px;
margin-bottom:0px;
margin-left:10%;
margin-right:10%;
}
.head
{
background-color:gray;
}
.nav
{
background-color:blue;
}
.content
{
background-color:lime;
}
</style>
</head>
<body>
<div class="container">
<div class="head">
<h1>Welcome to my page!</h1>
</div>
<div class="nav">
<h2>some text</h2>
</div>
<div class="content">
<p>Some text in content</p>
</div>
</div>
</body>
</html>
p
пәЊh1
е’Њh2
зљ„иң№и·қи®ңдёғ0
гЂ‚жӘЂжџӨз”жҰ€гЂ‚ - Collins Abitekaniza