Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Estou com problema pois minha tag <p> esta ultrapassando o limite da div em vez de quebrar linha
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<meta charset="utf-8">
<body>
<style type="text/css">
#capa {width: 100%; height: 250px; background-color: red;}
#conteudo{width: 1050px; margin: 0 auto; }
#conteudo .colesq {width: 722px; float: left; height: 500px; background-color: white; border: 2px solid black; }
#conteudo .coldir {width: 320px; float: right; height: 500px; background-color: white; border: 2px solid black;}
#rodape {width: 100%; height: 50px; background-color: green; float: left;}
#rodape {text-align: center; font-weight: bold;font-size: 18px;}
.colesq h1 {text-align: center;}
.colesq h3 {text-align: center;}
.colesq p {text-align: justify; font-style: italic; font-size: 15px; float: left; }
</style>
<div id="capa"></div>
<div id="conteudo">
<div class="colesq">
<h1>Titulo da postagem</h1>
<h3>Segundo titulo</h3>
<hr>
sadsadasdsadadasdsadadsadsadadsadadasdasdasdasdsadadasdasdasdasdasdsadsadasdasdasdsadsadasdsadadasdsadadsadsadadsadadasdasdasdasdsadadasdasdasdasdasdsadsadasdasdasdsadsadasdsadadasdsadadsadsadadsadadasdasdasdasdsadadasdasdasdasdasdsadsadasdasdasdtesao
</div>
<div class="coldir"> s</div>
</div>
<div id="rodape">
<p>Rodape</p>
</div>
</body>
</html>Você está usando uma "palavra" gigante, sem espaços, dai o navegador considera isso como um único "elemento".. Mas é fácil resolver.
Você precisa tirar o **"float: left"** da tag <p> e adicionar **"word-wrap: break-word;" **nela.
Leia sobre [word-wrap](https://www.w3schools.com/cssref/css3_pr_word-wrap.asp) e [white-space](https://www.w3schools.com/cssref/pr_text_white-space.asp), são propriedades CSS que ajudam na formatação de textos.
dá uma lida nesse artigo que deve ajudar
https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/