codice:
<!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" xml:lang="it" lang="it">
<head>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="revisit-after" content="7 days" />
<meta http-equiv="robots" content="index,follow" />
<meta http-equiv="Cache-Control" content="cache, must-revalidate" />
<meta http-equiv="pragma" content="cache" />
<title></title>
</head>
<body>
<div style="width:700px; border:1px solid red">
<div style="float:left; width:200px; height:200px; background:#CCCCCC; margin-right:10px">menu</div>
<div style="float:left; width:150px; height:400px; background:#666666; clear:left; margin-right:10px">banner</div>
<div style="float:right; width:200px; height:100px; background:#999999; margin-left:10px">newsletter</div>
<div style="float:right; width:200px; height:100px; background:#333333; clear:right; margin-left:10px">adv</div>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis non mauris a nibh vulputate sagittis. Quisque hendrerit enim ac purus. Fusce id enim. In eget neque. Donec porta tincidunt lectus. Etiam enim est, consectetuer nec, elementum id, nonummy vitae, risus. Mauris fringilla blandit dui. Aliquam erat volutpat. Nulla leo massa, tempor id, varius nec, ultricies eget, lacus. Cras adipiscing eros. Morbi neque enim, tempus mattis, commodo et, eleifend a, mi. Vestibulum iaculis, eros ac euismod gravida, libero metus gravida nibh, in fermentum velit leo at lorem. Sed porttitor metus vel metus. Curabitur a tortor. Ut eu metus et justo adipiscing condimentum. Mauris lobortis felis vitae pede.</p>
In mattis eleifend nulla. Suspendisse non est id nibh dapibus nonummy. Phasellus et sem. Maecenas id sapien. Nunc mattis felis id lectus. Donec tortor odio, dapibus eget, tincidunt et, ornare non, massa. Suspendisse auctor diam a risus. Fusce pulvinar turpis tincidunt lacus. Aliquam quam dolor, gravida ut, consequat quis, faucibus sed, nulla. Nulla mollis luctus tellus. Nam non neque at libero varius faucibus. Maecenas dapibus eleifend felis. Pellentesque congue nisl eget urna. Sed dictum nulla sit amet diam. Nunc pretium risus vitae lorem.</p>
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aliquam risus velit, fermentum a, commodo eu, varius malesuada, quam. Proin tempus sollicitudin ante. Maecenas eu mi non orci dictum scelerisque. Nulla dapibus metus id urna. Integer scelerisque accumsan dui. Donec et dolor. Morbi imperdiet vestibulum velit. Nam ornare. Curabitur lectus arcu, venenatis vitae, hendrerit vel, porta hendrerit, odio. Sed et pede. Nunc libero dui, eleifend a, imperdiet et, condimentum eget, magna. Morbi urna nisi, fermentum in, ullamcorper non, sodales a, risus. Etiam auctor. Etiam dui felis, aliquam aliquam, fringilla mollis, auctor dictum, neque. Proin euismod, metus nec hendrerit pellentesque, ipsum lectus convallis leo, sed hendrerit enim odio vel dolor. Phasellus at sapien. Quisque hendrerit interdum magna. Aliquam ipsum orci, convallis euismod, interdum eget, suscipit sit amet, elit. Nullam augue nisl, convallis sit amet, semper quis, interdum eget, metus.</p>
Donec egestas. Vestibulum ut nunc. Donec sit amet odio. In id sem. Nunc id neque. Fusce sagittis. Nullam egestas justo sed mauris. Sed a enim nec mi rutrum elementum. Etiam urna. Curabitur lobortis pellentesque nisi. Nam sollicitudin. Quisque neque. Vivamus varius vestibulum sem. Nam luctus, ipsum in rutrum feugiat, quam nulla commodo lectus, et pretium lectus ligula quis arcu. Vivamus est.</p>
<div style="clear:both"></div>
</div>
</body>
</html>
Con IE (6/7) funziona e viene così come io vorrei, tuttavia con Firefox ed Opera gli elementi flottanti sulla destra tendono a posizionarsi solo dopo l'altezza del primo div flottante a sinistra (MENU).
Rispondi quotando