PDA

View Full Version : Posizionare elementi dentro layout


sauron_x
30-05-2012, 02:03
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




<!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



* {

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?

sauron_x
30-05-2012, 13:01
Nessuna idea?

Il bello è su firefox che non si allinea. Ma sicuramente c'è un altro modo per allineare gli elementi in modo meno macchinoso.