Ciao,
sto iniziando a lavorare con i box model e sto facendo un esercizio che consiste nel:
1)Fare un Box in alto con il titolo;
2)Fare tre box sotto di esso dove vi è del testo con dei link;
3)Fare un box in alto a destra alla stessa altezza del box del titolo dove vi è il logo. Il box deve essere leggermente più alto del box del titolo in modo tale che vada a sovrapporsi alle box sottostante.

Io ho fatto

HTML
codice:
<!doctype html>
<html>
<head>
<title>Box definitivo</title>
  <link rel="stylesheet" type="text/css" href="spe1.css" >
</head>
<body>
<div class="intestazione">
      <h2>MiniMarket Capaldi</h2>
</div>
<div class="logo2">
      <img class="logo" src="logo.jpg" alt="logo" />
</div>
<div class="sinistra">
      Link alle pagine:<br/>
   Clicca <a class="link" href="corsi.html">qui</a>qui se vuoi andare al MiniMarket Salvoldi.<br/>
   Clicca<a class="link" href="">qui</a> se vuoi andare al MiniMarket Bonacina.
</div>
<div class="centro">
   Storia:<br/>
   Il nostro MiniMarket naque nel 1972 da Paolo Capaldi. 
   Da oltre 40 anni il nostro negozio e' sinonimo di qualia e freschezza. 
</div>
<div class="destra">
   Orari:<br/>
   Aperti tutta settimana dalle 8:00 alle 14:00
</div>
</body>
</html>
File CSS
codice:
img.logo {width: 100px; height: 60px;}
div.intestazione
{
  height:50px;
  width:550px;
  left:20px;
  right:20px;
  background-color:#0000FF;
  
}
div.logo2
{
  position: relative;
  z-index:1; /*porto in primo piano rispetto agli altri box */
  height:60px;
  bottom:50px;
  width:100px;
  left:450px;
  background-color:#964B00; /* colore marrone */
  
}
div.sinistra
{
  position:relative;
  height:150px;
  bottom:60px; /* sommo altezza logo */
  width: 150px;
  background-color:#FFFF00;
}
div.centro
{
  position:relative;
  height:150px;
  width: 200px;
  left: 150px;
  bottom: 210px; /* sommo altezza logo2 + altezza sinistra */
  background-color:#00FFFF;
}
div.destra
{
  position:relative;
  height:150px;
  width: 200px;
  left: 350px;
  bottom: 360px; /* sommo altezza logo + altezza sinistra + altezza centro */
  background-color:#00FF00;
}
a.link:link {color: blue;}
a.link:visited{color: brown;}

Io volevo avere delle delucidazioni su:
1) Come faccio a spostare l'intera struttura appena creata in qualsiasi punto della pagina;
2) C'è qualche altro modo per evitare di fare tutti questi box senza dovere aggiungere ogni volta la "position:relative" per metterli dove voglio io.
3)Come mai nei box del punto 2, quando aggiungo un titolo di qualsiasi formato <h1>, >h2>... il box mi trasla verso il basso?


Ciao e grazie