Ciao a tutti.Avrei una domanda da porvi. Ho trovato in un sito lo script per la visualizzazione in tempo reale dell'anteprima di un messaggio. Ho notato che qualora si inserisca una stringa insignificante molto lunga (ad 100 lettere tutte attaccate), il div relativo all'anteprima si allarga. Per curiosità ho provato a digitare una cosa simile anche nel blog di questo sito e ho visto che succede la stessa cosa. E' possibile evitarlo oppure si parte dal presupposto che una stringa così non verrà digitata?
Ho fatto alcune ricerche nei vari forum ma non ho trovato nulla circa la possibilità di bloccare la dimensione di un div. Esiste?
Grazie a tutti per l'attenzione.
<html>
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#container{
margin:0 auto;
padding:0;
text-align:left;
background:#e5e5e5;
width: 40em;
}
#box{
width:550px;
padding:10px;
margin:10px auto;
border:1px solid #800000;
background:#fff;
color:#000;
}
#box.commenti p.comment{
padding:0px 5px;
border-bottom:1px solid #800000;
font-size:90%;
}
#text{
border:1px solid #800000;
margin: 0 0 5px 20px;
background:#fff;
color:#000;
font-size:.9em;
font-family: 'trebuchet ms',verdana,arial,sans-serif;
}
</style>
<script type="text/javascript">
var nuovariga = /\n/g;
function SostituisciTextDiv() {
var NuovoTesto = document.getElementById("text").value;
NuovoTesto = NuovoTesto.replace(nuovariga, "
");
var DivElement = document.getElementById("anteprima");
DivElement.innerHTML = NuovoTesto;
}
</script>
</head>
<body>
<div id="container">
<h1>Inserisci il messaggio e guarda l'anteprima:</h1>
<form id="comm" action="#" method="post">
<fieldset>
<legend>Anteprima "in tempo reale"</legend>
<label for="text">Scrivi il messaggio:</label><textarea id="text" onkeyup="SostituisciTextDiv()" name="text" rows="10" cols="50"></textarea></p>
</fieldset>
</form>
</div>
<div id="box" class="commenti">
<p class="comment">Anteprima del messaggio</p>
<p id="anteprima"></p>
</div>
</body>
</html>
