OK, priklad, bude to delsi. Menu vlevo a nahore, v pravo neni problem pridat. Je to jen testovaci stranka, takze obsah neres. Kdyz bude ten text v block dost dlouhej, tak ti bude scrolovat. Otestovano v Mozille a validni je jak web tak css. V opere se to zobrazi trocha jinak, ale jeste furt OK, IE (6) to podela dokonale.
Kód:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html lang="cz" xml:lang="cz" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta name="author" content="Jezevec" /> <meta name="copyright" content="" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="stylesheet" href="./style.css" type="text/css" /> <title>main page</title> </head> <body><div class =" top_menu"> pokus</p></div><div class =" left_menu"> Novinky Informace o síti Jak co nastavit Statistiky Mapka WiFi Nodu _______________ Linky TPfree czfree Speednet _______________ Browsery Mozilla Opera </p> <a href="http://validator.w3.org/check/referer"> [img]pic/valid-xhtml10.png[/img] </a> <a href="http://jigsaw.w3.org/css-validator/"> [img]pic/valid-css.png[/img] </a> </div><div class="block"> ccc ccc ccc kokokokokokoko hlasdk jsalkd dkjfh kldjhfd lkjfdlskhf dslakhf hfksdajhf kdsajhf kajdsfh kjdshf kldsajhfkds jhkdlhfdsk fjadskfjh dksfjh ksajdhf slkadjhf alskhfieuhfakjfd vbaiufehoasdjf asdjfh dskjfh alkjdhf lakjdfkljad kjd fkljsdhf jdfkslajdhf klj ad jfksjdhf alksjdhf skjadhfl khfauefdcbdkjfbeufbksajdhf kjldhf asldf dskjahf alkjheufdkljhf alkdjhf aslkjdhf laskjf akj hfksjdhf akljhdlkj fhaslkdjfh asklefuh adfbdfu beuf bkdjfh lkaukehfdjfbauefb kjadfkl jaksdjfb le ufbadjfblkajsdf h Příliš žluťoučký kůň ďábelské ódy. </p> </div></body></html>Kód:/* Styles */ h1 { text-align: center; } .left_menu { position: fixed; text-align: center; overflow: hidden; height: 80%; top: 5em; left: 0em; width: 9em; z-index: 100; float: left; background-color: #66CC00; } .left_menu a { display: block; } .left_menu a:hover { background-color: #66AA00; } .left_menu a:focus { background-color: #88CC00; } .left_menu a:active { background-color: #BBCC00; } .left_menu img { position: absolute; border: 0; left: 20%; width: 88px; height:31px; z-index: 50; } #xhtml { bottom: 1em; } #css { bottom: 3em; } .top_menu { position: fixed; text-align: center; overflow: hidden; height: 5em; width: 100%; left: 0em; top: 0em; z-index: 100; background-color: #66CC00; } .block { position: absolute; text-align: justify; top: 7em; left: 9em; margin-left: 5%; margin-right: 5%; z-index: 1; }