Como limitar o texto dentro do div indepentende do tamanho do texto

[PauloRJ 4]

Fala pessoal, estou fazendo um teste para poder usar o div em minha pagina, mas o texto esta vazando do div, como limitar o texto dentro do div, independente do tamanho do texto.um exemplo de como estou fazendo:<div style="background-color: red; float: right; padding-right: 5; right: 100px; width: 50%; " id="pai2">oiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiii</div>

[IsraelCosta 0]

Você pode fazer assim:

 

<div style="background-color: red; float: right; padding-right: 5; right: 100px; width: 50%; overflow: hidden;>oiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiiioiii</div>

Ou se for usar css externo, assim:

elemento{  overflow: hidden}

[Giovani 104]

Olha só, além do overflow, tente digitar um texto "verdadeiro".Digo isso pq, as vezes, se você digita uam palavra tipo:oioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioioEla quebra a div mesmo. É diferente de digitar outra assim:oioioioi oioioi oi oioi oioioio oioioi oioii oioioioio É claro, você tem que definir uma altura e largura para a div tb!

[PauloRJ 4]

Valeu as dicas! Obrigado, é que estou começando a afundar-me em css agora.

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Poe 0]

Aproveitando, Paulo, tem uma ferramenta que vai ser muito útil pra você preencher de texto e fazer layouts. Entra no Lipsum e veja lá, ele gera texto aleatório em latim. Ótimo pra fazer layouts de sites e impressos.

 

Abraço.

[.:: Pegasus ::. 0]

Huhuaeaw... esse negócio é interessante.. sempre vi em vários exempos de layout e nunca soube o que era..Geralmente eu ficava inventando, ou colocando músicas. Obrigado.On Topic: Aconteceu isso comigo umas três veses, na quarta eu dei espaço e foi. o problema é esse, ele interpreta os "oioioaiosiaosioi" como uma palavra só, por isso não as quebra.

[Giovani 104]

Aconteceu isso comigo umas três veses, na quarta eu dei espaço e foi. o problema é esse, ele interpreta os "oioioaiosiaosioi" como uma palavra só, por isso não as quebra.

É isso mesmo que acontece, por isso pedi para colocar um texto de "verdade" http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif