Posizionare elementi dentro layout

29-05-2012, 23.38.01

Ciao a tutti!

Ho creato un layout in senso obliquo antiorario tramite photoshop. Per intenderci volevo fare per prova la struttura di un layout obliquo come ho visto su qualche template in giro e vedere come viene.

Ora non so come strutturare la cosa, è tutta la sera che do le varie misure per allineare per bene i vari elementi ma nulla. Se ci riesco alla fine in un browser risulta tutto ok e nell'altro no.

Per intenderci dentro questo layout che ho creato devo inserire:

- Logo

- Foto Gallery

- Menu orizzontale

- Menu verticale

Allego cmq l'html e il css così mi potete dire dove sbaglio e magari darmi qualche suggerimento.

HTML

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="en" lang="en">

<head>
	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
	<meta name="author" content="FreeUser" />
    <link href="style.css" rel="stylesheet" type="text/css" />

	<title>Rainbow</title>
</head>

<body>

    <div id="container">
    
    <img src="images/sfondo.gif"/>
    
    <img id="logo" src="images/logo.gif"/>
    
    
    <div id="gallery"></div>
  

    </div>

</body>
</html>

CSS

Codice:

* {
    
    margin: 0;
    padding: 0;
    
}

body {
    
    background-color:
    
}

#container {
    
    width: 1024px;
    height: 768px;
    margin: 0 auto;
    margin-top: 100px;
    
    
}

#logo {
    
    position: relative;
    bottom: 750px;
}

#gallery {
    
    width: 600px;
    height: 380px;
    background-color: black;
    margin-top: -820px;
    margin-left: 300px;

}

In genere il layout me lo sono sempre fatto io tramite i div, ma volevo provare a fare questo semplice effetto con photoshop.

Solo che ora sono un pò incasinato a posizionare i singoli elementi

Allego cmq il layout per rendere l'idea:

http://img577.imageshack.us/img577/6151/sfondog.gif

Come potrei fare?

30-05-2012, 18.58.47

Per rendere le misure uguali per ogni browser cambia unità di misura... sostituisci i PX con le percentuali %, dovrebbe funzionare.

Discussione: Posizionare elementi dentro layout

LinkBack

Strumenti discussione

Display

Posizionare elementi dentro layout

Regole di scrittura