codice html:

<!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>playROKGames - Gameplay, Trailer,Anteprime e tanto altro...</title>
<link rel="stylesheet" href="menu/Home.css" type="text/css" />
</head>
<body>



<div align="center">
<ul id="menu">[*]Home[*]ila18's Gameplays[*]Platinum Trophies[*]Recensioni[*]YouTube Channel[/list]
</div>

<div id="background">[img]Immagini/header.jpg[/img]
</div>

<div id="media">[img]Immagini/media.jpg[/img]
</div>
<div id="pubblicità1"></div>

<div id="pubblicità2"> </div>

<div id="news">News
</div>






<div id="pubblicitàbox">Pubblicità
</div>


<div id="vid1"><object width="500" height="306"><param name="movie" value="http://www.youtube.com/v/YysGNlRFXZQ?fs=1&amp;hl=it_IT&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/YysGNlRFXZQ?fs=1&amp;hl=it_IT&amp;rel=0" type="application/x-shockwave-flash" wmode="transparent" allowscriptaccess="always" allowfullscreen="true" width="500" height="306"></embed></object></div>



<div id="info1"><u>"Nuovo" trailer di Infamous 2</u>
</div>

<div id="descr1">Ecco un "nuovo" trailer di inFAMOUS 2 caricato su YouTube da playROKGames.
"Nuovo" perchè nel web era già stato divulgato un intero trailer contenente tutti 3 i
video "nuovi", di cui ne abbiamo caricato uno. Iscrivetevi al nostro canale di YouTube!</div>

<div id="date1"><u>13/01/2011</u></div>



<div id="vid2"><object width="500" height="306"><param name="movie" value="http://www.youtube.com/v/EYXY5o0Eve4?fs=1&amp;hl=it_IT&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/EYXY5o0Eve4?fs=1&amp;hl=it_IT&amp;rel=0" type="application/x-shockwave-flash" wmode="transparent" allowscriptaccess="always" allowfullscreen="true" width="500" height="306"></embed></object></div>

<div id="info2"> <u>Nuovo gameplay di COD Black Ops di ila18!</u>
</div>

<div id="descr2">Un nuovo ed entusiasmante gameplay in Call of Duty Black Ops di ila18.Un match non
perfetto ma degno di nota, come anche il suo precedente gameplay, sempre di Call of
Duty Black Ops! Iscrivetevi al nostro canale di YouTube!
</div>




</body>


</html>

codice css :

img.bg {
/* regole per riempire la pagina con lo sfondo prescelto */
min-height: 80px;
min-width: 1024px;

/* regole per ridimensionare l'immagine proporzionalmente */
width: 100%;
height: 80px;

/* posizonamento dello sfondo */
position:fixed;
top: 0;
left: 0;
z-index:30;
}

@media screen and (max-width: 1024px){
img.bg {
left: 50%;
margin-left: -512px; }
}

div#content {
/* regola importante per mostrare il contenuto sopra lo sfondo */
position: relative;


/* formattazione del div, non ha effetti sullo sfondo */
width: 500px;
margin: 0 auto;
background: #fff;
padding: 20px;
font-family: helvetica, arial, sans-serif;
font-size: 10pt;
line-height: 16pt;
-moz-box-shadow: #000 4px 4px 10px;
-webkit-box-shadow: #000 4px 4px 10px;
}

body {
/* formattazione del body, non ha effetti sullo sfondo */

margin: 0;
padding: 20px 0 0 0;
}



ul#menu
{
margin:0;
padding:0;
list-style-type:none;
width:100%;
position:fixed;
top:60px;
display:block;
height:30px;
font-size:12px;
font-weight:bold;
background:transparent url(images/nav_bg.png) repeat-x top left;
font-family:Arial, Helvetica, sans-serif;
border-bottom:1px solid #000000;
border-top:1px solid #000000;
z-index:31;
}

ul#menu li
{
display:block;
float:left;
margin:0;
padding:0;
}

ul#menu li a
{
display:block;
float:left;
color:#999999;
text-decoration:none;
font-weight:bold;
padding:8px 20px 0 20px;
}

ul#menu li a:hover
{
color:#FFFFFF;
height:22px;
background:transparent url(images/nav_bg.png) 0px -30px no-repeat;
}


ul#menu li a.current
{
display:inline;
height:22px;
background:transparent url(images/nav_bg.png) 0px -30px no-repeat;
float:left;
margin:0;
}

#pubblicità1 {
position:absolute;
top:200px;
left:15px;
z-index:21;
}

#pubblicità2 {
position:absolute;
top:500px;
left:80px;
}

#pubblicitàbox {
font-family:Verdana, Geneva, sans-serif;
font-size:24px;
position:absolute;
left:20px;
top:172px;
z-index:20;
}

img.md {
/* regole per riempire la pagina con lo sfondo prescelto */
min-height:100%;
min-width: 1024px;

/* regole per ridimensionare l'immagine proporzionalmente */
width: 100%;
height: auto;

/* posizonamento dello sfondo */
position:fixed;
top: 80px;
left: 0;
}

@media screen and (max-width: 1024px){
img.md {
left: 50%;
margin-left: -512px; }
}

div#content {
/* regola importante per mostrare il contenuto sopra lo sfondo */
position: relative;


/* formattazione del div, non ha effetti sullo sfondo */
width: 500px;
margin: 0 auto;
background: #fff;
padding: 20px;
font-family: helvetica, arial, sans-serif;
font-size: 10pt;
line-height: 16pt;
-moz-box-shadow: #000 4px 4px 10px;
-webkit-box-shadow: #000 4px 4px 10px;
}

body {
/* formattazione del body, non ha effetti sullo sfondo */

margin: 0;
padding: 20px 0 0 0;
}

#info1 {
font-family:Verdana, Geneva, sans-serif;
font-size:24px;
color:#CCC;
position:absolute;
top:215px;
left:350px;
}

#news {
font-family:Verdana, Geneva, sans-serif;
font-size:30px;
position:absolute;
top:120px;
left:540px;
}



#vid1 {
position:absolute;
top:265px;
left:350px;

}

#descr1 {
font-family:Verdana, Geneva, sans-serif;
font-size:11px;
color:#FFF;
position:absolute;
top:600px;
left:350px;
}

#date1 {
font-family:Verdana, Geneva, sans-serif;
font-size:11px;
color:#CCC;
position:absolute;
top:228px;
left:770px;
}

#vid2 {
position:absolute;
top:750px;
left:350px;
}

#info2 {
font-family:Verdana, Geneva, sans-serif;
font-size:21px;
color:#CCC;
position:absolute;
top:700px;
left:350px;
}

#descr2 {
font-family:Verdana, Geneva, sans-serif;
font-size:11px;
color:#FFF;
position:absolute;
top:1070px;
left:350px;
}

#sharefb {
position:absolute;
left:350px;
top:650px;
}