Problema posizione div rispetto ad altri due
Salve a tutti. Oggi ho deciso di scrivere una chat in php + ajax, e sto facendo l'architettatura della pagina. Solo che ho un problema. Intanto ecco il codice:
Codice HTML:
<html>
<head>
<title>Chat</title>
<script type="text/javascript">
/*function getElement(id) {
if(document.getElementById)
return document.getElementById(id);
return document.all[id];
}
function assegnaXMLHttpRequest() {
var XHR = null,
browserUtente = navigator.userAgent.toUpperCase();
if (typeof(XMLHttpRequest) === "function" || typeof(XMLHttpRequest) === "object")
XHR = new XMLHttpRequest();
else if (window.ActiveXObject && browserUtente.indexOf("MSIE 4") < 0) {
if(browserUtente.indexOf("MSIE 5") < 0)
XHR = new ActiveXObject("Msxml2.XMLHTTP");
else
XHR = new ActiveXObject("Microsoft.XMLHTTP");
}
return XHR;
}*/
</script>
<style type="text/css">
body {
background-color: #9F9F9F;
}
div#messaggi {
float: left;
padding-right: 600px;
border: 1px solid #000;
background-color: #8F7F7F;
}
div#user_online {
border: 1px solid #000;
background-color: #8F8F8F;
clear: right;
}
p#title {
font-size: 35;
font-style: italic;
font-weight: bold;
text-align: center;
}
div#write {
border: 1px solid #000;
position: relative;
clear: left;
}
</style>
</head>
<body>
<p id="title">Chat</p>
<div id="messaggi">A: ciao<br>B: ciao, come va?<br>A: bene<br>A: ciao<br>B: ciao, come va?<br>A: bene<br>A: ciao<br>B: ciao, come va?<br>A: bene<br>A: ciao<br>B: ciao, come va?<br>A: bene<br></div>
<div id="user_online">A<br>B<br>C<br>A<br>B<br>C<br>A<br>B<br>C<br>A<br>B<br>C<br>A<br>B<br>C<br></div>
<div id="write">Write:<br>aaaaa</div>
</body>
</html>
Come vedete visualizzando la pagina, se il div con id="user_online" č pių lungo del div con id="messaggi" il primo va ad invadere lo spazio del secondo. Vorrei che non accadesse, come posso fare?
