I'm having issues setting up a container div keeping text within the container div - html

Question

For some reason the body tag settings spill into the container div and text in the p tag goes out of the container div boundaries. I don't know why. Adding another div and applying the settings there fixed the issue, but I wanted the settings to apply to the container div.
I was expecting a centered green div with the placeholder text in it aligned like the rest of the elements, and a grey background using the body tag. How can I solve this problem?
body {
width: 100%;
color: #A4A7A5;
}
div #container {
color: #63EC91;
width: 80%;
margin: 0 auto;
padding: 10px;
}
ul {
list-style: none;
background-color: black;
margin: 20px;
text-align: center;
list-style-type: none;
padding: 20px;
}
li {
text-align: center;
font-size: 1.5em;
font-family: Roboto;
display: inline;
color: white;
padding: 20px;
}
li a {
text-decoration: none;
color: lightgrey;
padding: 20px;
}
li a:hover {
background-color: lightgreen;
}
#container .FCR {
width: 20%;
text-align: center;
color: lightgrey;
font-size: 1.5em;
font-family: Roboto, Arial;
}
p {
text-align: center;
color: lightgrey;
font-size: 0.8em;
font-family: Roboto, Arial;
}
h1 {
margin: 20px;
padding: 0;
text-align: center;
color: lightgrey;
font-size: 1.5em;
font-family: Roboto, Arial;
}
<div id="container">
<ul>
<li>Pocetna</li>
<li>O nama</li>
<li>Kontakti</li>
<li>Galerija</li>
</ul>
<h1>Meni stranica</h1>
<hr>
<br>
<p class="FCR"> FCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCR</p>
</div>

Answer 1

I think ur problem is about
FCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCRCR
text that u put inside of p tag.
default browser split the word and put their into new line when there is any space (" ") between words BTW I guess u can use word-wrap: break-word to change this behavior.
Also u can use overflow property to prevent this but it's not a good solution.