Ciao, come posso fare per allineare il menu a sx accanto al div content che si veda attaccato per bene a tutte le risoluzioni? Io ho messo i margini a 0 e il float left ma su un computer si vede tutto a sx e su un'altro sopra il content. Come faccio? Il sito è questo: www.webalice.it/fragola81 (è da finire).
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xml:lang="it" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"
<title>.::PinkBetta::.</title>
<link rel="stylesheet" type="text/css" href="style.css" media="screen">
<script language="JavaScript" src="Contatore/conta.asp"></SCRIPT>
</head>
<body>
<div id="container">
<div id="header">
</div>
<div id="menu">
</div>
<div id="content">
<h3>Ciao,</h3>
mi chiamo Silvia e sono appassionata di computer, in modo particolare di
grafica digitale, e di animali, soprattutto dei pesci tropicali
d'acqua dolce sudamericani e asiatici (i miei beniamini sono gli appartenenti alle famiglie
dei callittidi e degli anabantidi). Ho realizzato questo sito dove ho inserito
le foto del mio acquario e varie foto che ho fatto in giro e a casa mia a luoghi, oggetti o
animali che mi sembravano interessanti. Non sono una brava fotografa ma la mia
intenzione è quella di avere un ricordo di ciò che trovo interessante. Altre mie passioni
sono le conchiglie (di cui ho una collezione, le mie preferite sono le Xenophora sp.), la
musica (se vi interessa ho realizzato questo sito quasi interamente con la musica
di Renato Zero di sottofondo) e andare a giro, quando posso a manifestazioni
ed eventi riguardanti pesci, computer e non solo.
Per realizzare questo sito ho usato il codice HTML e mi sono servita dei CSS per l'aspetto
grafico, in modo da realizzarlo senza l'uso di tabelle per l'impaginazione, ed ho
ripreso sul web gli script per l'effetto LightBox2 sugli ingrandimenti delle
immagini. Ho scritto quasi tutto il codice HTML e CSS senza l'uso di particolari programmi, ma usando per lo
più un comunissimo editor di testo.</p>
Vi lascio alla visita sul sito, ciao!</p>
[img]varieimg/barra.gif[/img]
</p>
[img]varieimg/vasi.gif[/img]
[img]varieimg/color.gif[/img]
[img]varieimg/rosso.gif[/img]
</div>
</p>
<div id="footer">
</div>
</div>
</body>
</html>
CSS
/*Css Document - Design by PinkBetta*/
body {
font-family:Times New Roman, Verdana;
background-image:url(varieimg/muro5.jpg);
background-position:center;
margin-bottom:0px;
margin-left:0px;
margin-right:0px;
margin-top:10px;
text-align:center;
}
#container {
margin:0px auto;
text-align:left;
background-image:url(varieimg/back.gif);
background-position:center;
background-repeat:repeat-y;
}
h3 {
text-align:center;
font-style:italic;
}
h4 {
text-align:left;
padding:0px 0px;
font-size:15px;
line-height:1px;
font-style:italic;
}
p {
text-align:left;
}
img {
border: none;
}
#header {
background-image:url(varieimg/header.jpg);
width:800px;
height:210px;
background-repeat:no-repeat;
background-position:center;
margin:0px auto;
}
#menu {
width:200px;
height:auto;
margin:0px auto;
padding-top:30px;
padding-bottom:20px;
text-align:left;
float:left;
background-image:url(varieimg/backmenu.gif);
background-repeat:no-repeat;
background-position:center;
}
#menu ol{
list-style-type:none;
list-style positionutside;
}
#menu ol li a{
text-decoration:none;
font-size:16px;
color:#FF0099;
font-style:italic;
font-weight:bold;
letter-spacing:3px;
}
#menu a:hover {
color:white;
background-color:#f0bbff;
}
#menuacqua ul li {
text-decoration:none;
color:black;
}
#content {
overflow:auto;
width:600px;
height:auto;
margin:0px 0px 0px 0px;
text-align:center;
}
#gallery {
text-align:center;
}
#footer {
background-image:url(varieimg/footer.jpg);
background-position:right;
background-repeat:no-repeat;
width:700px;
height:35px;
clear:both;
margin:0px auto;
}
Grazie!
Rispondi quotando