Keskustelu: Nettisivujen teko: CSS tekstin overflow?

dwarfer [10.06.2010 13:50:16]

Määritän css:llä diville leveyden. Jos kuitenkin kirjoitan tekstiä divien sisälle enemmän kuin sen leveys on, niin teksti jatkuu boksin yli eikä mene seuraavalle riville? Kuinka saan sen automaattisesti toiselle riville?

En siis tahdo scrollbareja vaan ainoastaan että div venyy korkeus suunnassa ja leveys pysyy vakiona.

Jaaa "selventävä" "kuva":

|----------|              --->         |----------|
|aaaaaaaaaa|aaaaaaaa                   |aaaaaaaaaa|
|          |                           |aaaaaa    |
|__________|                           |__________|

Edit:

div.box_incontent {
	background-color: #ebf4f3;
	//position: relative;
	border: 1px double #edf6f5;
	//overflow: auto;
	margin: 3px 3px 5px 3px;
	width: 98%;
}

<div class=\"box_incontent\"><b>TODO:</b><br>Print"-chartsaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
</div>

Othnos [10.06.2010 14:02:00]

Jos tekstisi sisältää välilyöntejä osaa selain rivittää tekstin automaattisesti divin sisään jolle on normaalisti width määritetty. Jos tarkoitus on saada rivitettyä ilman välilyöntejä olevaa tekstiä saa joku muu auttaa.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title></title>
</head>

<body>
<div style="width:500px;border:solid 1px black;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sagittis vestibulum nisl eu pulvinar. Integer viverra ligula eu lorem pharetra sed posuere mi tincidunt. Morbi fermentum risus at diam iaculis et laoreet turpis tincidunt.
</div>
</body>

</html>

edit:

Särkyi tämäkin foorumi tuon 'aaaa....'-viestin takia. Painin itsekin joskus kyseisen ongelman kanssa, kun pastesin random-sanoja putkeen ilman välilyöntejä.

edit2:

Kiitos Macro. PHP-puolen tapa jäänyt näköjään html-koodiinikin.

dwarfer [10.06.2010 14:05:42]

Heh, katos perkule niinpä tekeekin :P. Kiits.

Macro [10.06.2010 14:22:19]

Othnos: =-merkin ympärillä ei kuulu olla välilyöntejä.

Vastaus

Aihe on jo aika vanha, joten et voi enää vastata siihen.

Kirjautuminen