text-align: justify; also doesn’t work
here’s my code:
<div id="navigation">
<ol>
<li><a href="#">Gry</a>
<ul>
<li><a href="#">Tibia</a></li>
<li><a href="#">Overwatch</a></li>
<li><a href="#">World of Warcraft</a></li>
<li><a href="#">League of Legends</a></li>
<li><a href="#">Counter strike</a></li>
</ul>
</li>
<li><a href="#">Drużyna</a>
<ul>
<li><a href="#">Marcin</a></li>
<li><a href="#">Wiktor</a></li>
<li><a href="#">Artur</a></li>
<li><a href="#">Adaś</a></li>
<li><a href="#">Goriat</a></li>
</ul>
</li>
<li><a href="#">Kontakt</a></li>
<li><a href="#">Galeria</a>
<ul>
<li><a href="#">Obozy</a></li>
<li><a href="#">Turnieje</a></li>
</ul>
</li>
</ol>
</div>
<div id="content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ultrices nibh ut arcu commodo posuere. Fusce tincidunt nisl elit, eu vulputate sapien pellentesque at. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Mauris varius egestas neque in malesuada. Aenean semper, velit non dictum vestibulum, metus nibh dapibus tortor, quis ultricies libero urna hendrerit dui. Vestibulum hendrerit nisi quam, dictum accumsan metus ornare id. Ut sed imperdiet tellus. Vivamus vehicula, metus eget dictum dictum, erat nulla cursus dui, non scelerisque dui nunc eget magna. Praesent molestie nisi sit amet efficitur vulputate. Suspendisse potenti. Phasellus non mauris massa. Morbi molestie mauris vel enim varius vulputate. Etiam vitae leo et tortor pulvinar sodales. Donec sed nisl erat. Integer nec blandit enim. Suspendisse sit amet quam non nunc ullamcorper imperdiet. </p>
<br>
<p>Mauris consectetur elit et gravida ultricies. Mauris orci urna, posuere quis pretium non, eleifend et lorem. Quisque eget nibh volutpat, consequat quam in, scelerisque quam. Pellentesque consequat ut leo eu feugiat. Phasellus nec cursus elit. Aenean ut dui erat. Donec feugiat mi diam, at sagittis nibh pellentesque sed. Curabitur eu tempus leo, non cursus lacus. Pellentesque ornare odio vel justo ultrices, non ultrices neque vestibulum. Ut maximus hendrerit eleifend. Vivamus aliquet aliquam tristique. Ut elementum ornare hendrerit. </p>
<br>
<p>Nulla facilisi. Morbi dignissim risus quam, a rutrum nunc tincidunt et. Praesent at ultricies mi. Ut tortor felis, facilisis ac pulvinar vel, faucibus at elit. Integer commodo rhoncus mauris in vestibulum. Etiam ut mollis eros, non malesuada sapien. Sed id arcu sem. Nullam varius interdum neque, sed varius turpis sagittis eu. Duis mollis pretium est. Etiam purus ligula, vulputate quis pretium id, viverra ut urna. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. </p>
<br>
<p>Etiam ornare placerat odio et pulvinar. Maecenas pretium, sapien sit amet egestas molestie, metus est rutrum elit, ut molestie turpis orci ac leo. Praesent ac lobortis velit. Donec vel risus metus. Vestibulum ante nulla, mattis nec felis et, tempor semper diam. Fusce purus nibh, rhoncus ut convallis malesuada, maximus et dolor. Phasellus iaculis nibh ac massa porta, a facilisis lacus venenatis. Curabitur ut magna arcu. Aenean semper, augue eu condimentum rhoncus, odio magna accumsan lacus, at hendrerit mauris lorem vel libero. Duis consequat lacus vel eleifend commodo. </p>
<br>
<p>Quisque sagittis bibendum risus a rhoncus. In at velit sed odio rhoncus dignissim ut in lorem. Aenean enim justo, porta vitae feugiat nec, porta quis tellus. Aliquam blandit nunc sem, dictum placerat eros feugiat vitae. Aenean gravida vehicula quam. Integer vel ultrices urna, quis varius felis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc facilisis augue in lacinia fringilla. Nulla sit amet auctor nunc. </p>
</div>
#container {
width: 80%;
margin-left: auto;
margin-right: auto;
}
#navigation {
}
ol {
list-style-type:none;
padding:0;
margin-top: 7px;
font-size:18px;
height:2.33em;
line-height:2.33em;
text-align: center;
background-color:#FFF;
}
ol > li {
float: left;
background-color: #666666;
width: calc(100%/4);
margin-left: 0px;
}
ol a {
display:block;
color:#000;
text-decoration:none;
padding:0 5px;
}
ol > li > a:hover {
color: #800000;
}
ol > li:hover {
background-color: #ddd;
}
ol > li > ul {
list-style-type:none;
padding:0;
margin:0;
display: none;
}
ol > li:first-child {
margin-left:0;
}
ol > li > ul > li > a {
border-top:1px dashed #a6a6a6;
}
ol > li > ul > li {
background-color: #808080;
}
ol > li > ul > li:hover {
background-color:#DDD;
}
ol > li > ul > li:hover a {
color:#800000;
}
ol > li:hover > ul {
display: block;
}
#content {
background-color: #808080;
text-align: justify;
font-size: 18px;
}
