Erro de renderização de div no chrome

[Felipe Paz]

E ae galera, tudo beleza? Sou novo no meio web development e já surgiu um erro que eu não estou sabendo identificar.

 

Estou criando um site pessoal, contudo, no firefox está tudo ok, todavia, quando acesso o site com o chrome, duas divs ficam sobrepostas.

 

Vou passar o trecho do html e do css (refere às divs noticias e html ):

 

 <div class="html">
                    <div class="htmltexto">
                        <p>
                        Aenean placerat. In vulputate urna eu arcu. Aliquam erat volutpat. Suspendisse potenti. Morbi mattis feliz at nunc. Duis viverra diam non justo. In nisl. Nullam sit amet magna in magna gravida vehicula. Mauris tincidunt sem sed arcu. Nunc posuere. Nullam lectus justo, vulputate eget, mollis sed, tempor sed, magna. </p>
                        <img src="Imagens/html5-css3.png">
                   </div>
 </div>
            
            
            
            <div class="noticias">
                <div id="blog"></div>
                <h1 id="ti-not">Confira as últimas notícias sobre tecnologia</h1>
                <div class="container-noti">
                    <div class="noticia">
                        <h2>Título</h2>
                        <p>
                        Aenean placerat. In vulputate urna eu arcu. Aliquam erat volutpat. Suspendisse potenti. Morbi mattis feliz at nunc. Duis viverra diam non justo. In nisl. Nullam sit amet magna in magna gravida vehicula. Mauris tincidunt sem sed arcu. Nunc posuere. Nullam lectus justo, vulputate eget, mollis sed, tempor sed, magna. </p>
                        <a href="">Leia mais</a>
                    </div>
                    <div class="noticia">
                        <h2>Título</h2>
                        <p>
                        Aenean placerat. In vulputate urna eu arcu. Aliquam erat volutpat. Suspendisse potenti. Morbi mattis feliz at nunc. Duis viverra diam non justo. In nisl. Nullam sit amet magna in magna gravida vehicula. Mauris tincidunt sem sed arcu. Nunc posuere. Nullam lectus justo, vulputate eget, mollis sed, tempor sed, magna. </p>
                        <a href="">Leia mais</a>
                    </div>
                    <div class="noticia">
                        <h2>Título</h2>
                        <p>Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper, nibh ante cursus purus, vel sagittis velit mauris vel metus. Aenean fermentum risus id tortor. Integer imperdiet lectus quis justo. Integer tempor. Vivamus ac urna vel leo pretium faucibus. Mauris elementum mauris vitae tortor. In dapibus augue non sapien. Aliquam ante. Curabitur bibendum justo non orci.</p>
                        <a href="">Leia mais</a>
                    </div>
                    <div class="noticia">
                        <h2>Título</h2>
                        <p>Praesent in mauris eu tortor porttitor accumsan. Mauris suscipit, ligula sit amet pharetra semper, nibh ante cursus purus, vel sagittis velit mauris vel metus. Aenean fermentum risus id tortor. Integer imperdiet lectus quis justo. Integer tempor. Vivamus ac urna vel leo pretium faucibus. Mauris elementum mauris vitae tortor. In dapibus augue non sapien. Aliquam ante. Curabitur bibendum justo non orci.</p>
                        <a href="">Leia mais</a>
                    </div>
                </div>
            </div>

Citação

 

* {
    margin: 0px;
    padding: 0px;
}

body {
    font-family: Arial, Verdana, sans-serif;
    color: black;
    background: white;
}

.backmenu {
    float: left;
    width: 100%;
    background: white;
    height: 80px;
    position: fixed;
    margin-top: -50px;
}

.menu {
    float: left;
    background: #5282E2;
    width: 100%;
    display: inline;
    box-shadow: 4px 4px 4px black;
    position: fixed;
    height: 100px;
    margin-top: 80px;
}

.menu li {
    display: inline;
    float: left;
    margin-top: 40px;
}

.menu li:first-child {
    margin-left: 70px;
}

.menu a {
    text-decoration: none;
    color: white;
    transition: color 0.2s ease-out;
}

.menu a:hover {
    color: black;

}

.logo {
    float: right;
    margin-right: 60px;
    margin-top: -60px;
}

.banner {
    background-image: url("../Imagens/back.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
}

.intro {
    float: left;
    color: white;
    text-shadow: 3px 3px 3px black ;
    margin-top: 175px;
    margin-left: 40px;
    font-size: 25px;
    margin-bottom: 227px;
    transition: color 0.1s ease-out;
}

.intro h1 {
    width: 300px;
}

.intro:hover {
    color: #5282e2;
    text-shadow: 6px 6px 6px black;
}

.icones {
    margin-top: 20px;
    float: right;
    margin-right: 70px;
}

.servicos {
    width: 1100px;
    height: 700px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
}

.java {
    margin-top: 5px;
    background-image: url(../Imagens/back-java2.jpg);
    -moz-background-image: url(../Imagens/back-java2.jpg);
    -webkit-background-image: url(../Imagens/back-java2.jpg);
    -o-background-image: url(../Imagens/back-java2.jpg);
    background-attachment: fixed;
    width: 100%;
    height: 800px;
}

.javatexto {
    width: 100%;
    background: beige;
    height: 300px;
    float: left;
    margin-top: 500px;
}

.javatexto p {
    margin-top: 70px;
    width: 500px;
    float: right;
    text-align: justify;
    padding-right: 50px;
}

.javatexto img {
    margin-top: 15px;
    padding-left: 50px;
}

.html {
    margin-top: 5px;
    background-image: url(../Imagens/imagem3.jpg);
    -moz-background-image: url(../Imagens/imagem3.jpg);
    -webkit-background-image: url(../Imagens/imagem3.jpg);
    -o-background-image: url(../Imagens/imagem3.jpg);
    background-attachment: fixed;
    width: 100%;
    height: 800px;
}

.htmltexto {
    width: 100%;
    background: beige;
    height: 300px;
    float: right;
    margin-top: 500px;
}

.htmltexto p {
    margin-top: 70px;
    width: 500px;
    float: left;
    text-align: justify;
    padding-left: 50px;
}

.htmltexto img {
    margin-top: 15px;
    padding-right: 50px;
    float: right
}

.noticias {
    width: 100%;
    background: rgba(0,51,102,0.3);
    -moz-background: rgba(0,51,102,0.3);
    -webkit-background: rgba(0,51,102,0.3);
    -o-background: rgba(0,51,102,0.3);
    background-position: center;
    height: 590px;
    float: left;
    margin-top: 20px;
}

#ti-not {
    text-align: center;
    margin-top: 15px;
}
.container-noti {
    width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

.noticia {
    float: left;
    width: 350px;
    background: rgba(250,250,250,0.5);
    -moz-background: rgba(250,250,250,0.5);
    -webkit-background: rgba(250,250,250,0.5);
    -o-background: rgba(250,250,250,0.5);
    margin-left: 120px;
    margin-bottom: 3px;
    border-radius: 4px;
    box-shadow: 3px 3px 3px black;
    margin-top: 30px;
    
}

.noticia h2 {
    border-bottom: 1px dashed black;
    width: 70%;
    padding-bottom: 5px;
    padding-left: 5px;
    padding-top: 4px;
}

.noticia p {
    text-align: justify;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 5px;
    padding-top: 5px;
}

.noticia a {
    float: right;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
    background: #5282e2;
    text-decoration: none;
    color: white;
    transition: background 0.1s ease-out, color 0.1s ease-out;
    margin-right: 5px;
    margin-bottom: 5px;
}

.noticia a:hover {
    color: black;
    background: white;
    color: #5282e2;
}

.contato {
    float: left;
    width: 100%;
    background: white;
    margin-top: 15px;
    height: 780px;
}

.contato h1 {
    color: #c0c0c0;
    font-family: Georgia;
    margin-top: 15px;
    margin-left: 30px;
    box-shadow: 3px 3px 3px black;
    width: 500px;
}
.contato-banner {
    width: 100%;
    background: #c0c0c0;
    height: 316px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    margin-bottom: 25px;
}

.contato-banner img {
    margin-left: 180px;
}

.form-pos {
    float: left;
    width: 500px;
    margin-left: 100px;
}

.form-cont {
    float: right;
    width: 500px;
    margin-right: 150px;
    color: #5282E2;
    margin-top: 16px;
}

.form-cont p {
    margin-bottom: 30px;
}

.form-cont h2 {
    margin-bottom: 30px;
}

.formulario input {
    margin-top: 20px;
    margin-left: 150px;
    width: 300px;
    border: 1px solid gray;
    height: 40px;
    padding-left: 5px;
}

.formulario input:hover {
    border: 1px solid red;
    height: 40px;
}

.formulario input:focus {
    border: 1px solid red;
    height: 40px;
}

.formulario textarea {
    margin-top: 20px;
    margin-left: 150px;
    border: 1px solid gray;
    padding: 5px;
}

.formulario textarea:hover {
    border: 1px solid red;
}

.formulario textarea:focus {
    border: 1px solid red;
}

.formulario button {
    width: 100px;
    height: 35px;
    margin-top: 15px;
    margin-left: 150px;
}

.rodape {
    background-image: url(../Imagens/blue4.png);
    -moz-background-image: url(../Imagens/blue4.png);
    -webkit-background-image: url(../Imagens/blue4.png);
    -o-background-image: url(../Imagens/blue4.png);
    background-position: right center;
    width: 100%;
    height: 400px;
    float: left;
    margin-top: 15px;
}

.footer {
    width: 300px;
    margin-top: 130px;
    margin-left: 100px;
    float: left;
    color: black;
}

.footer address {
    text-shadow: 2px 2px 2px gray;
    font-size: 18px;
}

.rights {
    float: left;
    margin-top: 63px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align: center;
    padding-top: 25px;
    padding-bottom: 25px;
    color: white;
    background: rgba(0,0,0,0.7)
}
/* Só elementos */

#opacidade {
    float: right;
    background: rgba(0, 0, 0, 0.6);
    width: 80%;
    height: 100px;
    -moz-background: rgba(0, 0, 0, 0.6);
    -webkit-background: rgba(0, 0, 0, 0.6);
    -o-background: rgba(0, 0, 0, 0.6);
    
}

.fade {
    opacity: 0.5;
}

.fade:hover {
    opacity: 1;
}

.clear {
    clear: both;
}

A div noticia sobrepõe a div html, no chrome.

Dá pra conferir o site no k9sistemas.comli.com