Google sites content taking up entire window - html

Question

I am working on a Google site for a school project. However, the site looks like
instead of
I did not add the extra stuff, Google sites added it for me. Is there any way to get rid of it?
.titlebox {
display: block;
margin: 10px;
padding: 50px;
background-color: yellow;
border-radius: 10px;
border: 2px solid black;
text-align: center;
}
.map {
margin: 10px;
display: inline;
float: left;
padding: 20px;
background-color: green;
border-radius: 10px;
border: 2px solid black;
}
.content {
margin: 10px;
display: inline;
float: right;
padding: 20px;
background-color: orange;
border-radius: 10px;
border: 2px solid black;
}
a div {
color: black;
text-decoration: none;
padding: 5px;
border-radius: 10px;
border: 2px;
}
a:hover div {
color: orange;
text-decoration: none;
padding: 5px;
border-radius: 10px;
border: 2px;
background-color: blue;
}
<div class="titlebox">
<h1>GMO DEBATE</h1>
</div>
<div class="map">
<div text-align="center">
<h3>pages:</h3>
</div>
<ul>
<li>
<a href="pro">
<div>why GMOs should be labeled</div>
</a>
</li>
<li>
<a href="con">
<div>why GMOs shouldn't be labeled</div>
</a>
</li>
<li>
<a href="info">
<div>background information</div>
</a>
</li>
</ul>
</div>
<div class="content">
<h3>Should GMOs be labeled?</h3>
</div>
That is in a code box, although I don't think it matters since the extra stuff was there before I even added anything. Adding a width to the elements does not help.

Answer 1

As you said its code box in code box you can display your content only in limited area you will be allotted only some give space 75% or 70% of page display area.
If you need Your website on full page like as you want find a free host site like http://www.000webhost.com and host you web pages you can do what ever you want