Salve! Io sto creando un sito ed ho riscontrato dei problemi con il css.
Ho creato un file index.html a cui ho collegato un foglio di stile esterno, ma ho un problema...in pratica fra un immagine e il resto del testo c'è uno spazio che non dovrebbe esserci...
mi hanno suggerito di mettere questa immagine tramite il css come sfondo del div #content...
ma forse sbaglio qualcosa.....
qualcuno può dirmi dove sta l'errore?
scrivo di seguito il 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>
<title>Agenzia di viaggi</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="css/style-home.css" type="text/css" rel="stylesheet"></link>
</head>
<body>
<div class="wrapper" id="header"><img src="img/banner.jpg" width="760" height="200" alt="banner"/>
<img src="img/sfondo.png" alt="sfondo"/>
<div class="wrapper"><img src="img/main.png" alt="immagine"/>
<ul id="menu">
<li><a href="index.html" title="torna alla home page">Home |</a></li>
<li><a href="iviaggi.html" title="vai alla pagina i nostri viaggi">I Nostri Viaggi |</a></li>
<li><a href="offerte.html" title="vai alla pagina le nostre offerte">Le nostre Offerte |</a></li></ul>
<div class="wrapper" id="content">
<h2> <b>Agenzia di Viaggi - La Meridiana</b></h2>
<div id="leftbar">
<a href="index.html" title="collegamento a www.Turista.it">Turista.it</a>
<a href="index.html" title="collegamento a www.ilgiramondo.net">ilgiramondo.net</a>
<br/>
<img src="img/viaggi1.jpg" alt="immagine"/>
<p>L’agenzia Meridiana è a
vostra disposizione dal Lunedì al Sabato
in via Carlo Rossi 15, Palermo.</p>
<p><b>News</b></p>
<p>Grandi offerte per il mese di
Maggio a Lampedusa</p>
<p>Fine settimana a Taormina</p>
<p>Le Eolie in Giugno</p></div>
<div id= "main_content">
<p>L’agenzia di viaggi Meridiana è l´agenzia online per le tue vacanze:
migliaia di offerte da non perdere,voli a prezzi speciali, camere in oltre
70000 hotel, viaggi indimenticabili,noleggio auto in più di 7000 località in tutto il mondo</p>
<img src="img/home.jpg" alt= "home"/></div>
<div class="wrapper" id="footer">
<p>Questo sito è stato realizzato da Maddalena Farruggia, e sarà valido XHTML 1.0
Transitional.<img src="img/valid-xhtml10.png" alt="immagine"/></p>
</div></div></div></div></body>
</html>
e il mio css:
*{
margin:0;
padding:0;
}
html
{
margin:0;
padding:0 5px;
background:url(../img/banner.png) center top
repeat-y;
font-family:Arial, Helvetica, sans-serif;
}
body
{
width:100%;
height:auto;
}
A:LINK{
text-decoration: none;
color: gray;
}
A:VISITED{
text-decoration: none;
color: gray;
}
A:HOVER{
Color:gray;
text-decoration: none;
}
A:ACTIVE{
COLOR: gray;
text-decoration: none;
}
.wrapper
{
width:760px;
margin:0 auto;
padding:10px;
}
#header
{
width:760px;
height: auto;
padding: 0;
}
#content
{
background: url(main.png) center top no repeat;
height:550px;
}
#footer
{
height:70px;
}
#menu
{
width:auto;
height:auto;
margin:0;
padding:5px;
list-style:none;
background:"img/viaggi1.jpg" top center no-repeat;
}
#menu li
{
display:inline;
margin:0;
padding:0 5px;
font-family: Arial, Helvetica, sans-serif;
color:gray;
}
h1
{
font-size:32px;
font-family: Arial, Helvetica, sans-serif;
color:black;
}
#leftbar
{
border-right:1px dashed gray;
width:130px;
height:550px;
padding:5px;
float:left;
}
#main_content
{
width:550px;
height:550px;
margin:0;
padding:5px;
float:left;
margin-left:25px;
font-size:12px;
}
#leftbar p, #main_content p
{
margin:5px 0;
font-size:12px;
}
#footer p
{
font-size:10px;
}
Grazie!!
Ho creato un file index.html a cui ho collegato un foglio di stile esterno, ma ho un problema...in pratica fra un immagine e il resto del testo c'è uno spazio che non dovrebbe esserci...
mi hanno suggerito di mettere questa immagine tramite il css come sfondo del div #content...
ma forse sbaglio qualcosa.....
qualcuno può dirmi dove sta l'errore?
scrivo di seguito il 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>
<title>Agenzia di viaggi</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="css/style-home.css" type="text/css" rel="stylesheet"></link>
</head>
<body>
<div class="wrapper" id="header"><img src="img/banner.jpg" width="760" height="200" alt="banner"/>
<img src="img/sfondo.png" alt="sfondo"/>
<div class="wrapper"><img src="img/main.png" alt="immagine"/>
<ul id="menu">
<li><a href="index.html" title="torna alla home page">Home |</a></li>
<li><a href="iviaggi.html" title="vai alla pagina i nostri viaggi">I Nostri Viaggi |</a></li>
<li><a href="offerte.html" title="vai alla pagina le nostre offerte">Le nostre Offerte |</a></li></ul>
<div class="wrapper" id="content">
<h2> <b>Agenzia di Viaggi - La Meridiana</b></h2>
<div id="leftbar">
<a href="index.html" title="collegamento a www.Turista.it">Turista.it</a>
<a href="index.html" title="collegamento a www.ilgiramondo.net">ilgiramondo.net</a>
<br/>
<img src="img/viaggi1.jpg" alt="immagine"/>
<p>L’agenzia Meridiana è a
vostra disposizione dal Lunedì al Sabato
in via Carlo Rossi 15, Palermo.</p>
<p><b>News</b></p>
<p>Grandi offerte per il mese di
Maggio a Lampedusa</p>
<p>Fine settimana a Taormina</p>
<p>Le Eolie in Giugno</p></div>
<div id= "main_content">
<p>L’agenzia di viaggi Meridiana è l´agenzia online per le tue vacanze:
migliaia di offerte da non perdere,voli a prezzi speciali, camere in oltre
70000 hotel, viaggi indimenticabili,noleggio auto in più di 7000 località in tutto il mondo</p>
<img src="img/home.jpg" alt= "home"/></div>
<div class="wrapper" id="footer">
<p>Questo sito è stato realizzato da Maddalena Farruggia, e sarà valido XHTML 1.0
Transitional.<img src="img/valid-xhtml10.png" alt="immagine"/></p>
</div></div></div></div></body>
</html>
e il mio css:
*{
margin:0;
padding:0;
}
html
{
margin:0;
padding:0 5px;
background:url(../img/banner.png) center top
repeat-y;
font-family:Arial, Helvetica, sans-serif;
}
body
{
width:100%;
height:auto;
}
A:LINK{
text-decoration: none;
color: gray;
}
A:VISITED{
text-decoration: none;
color: gray;
}
A:HOVER{
Color:gray;
text-decoration: none;
}
A:ACTIVE{
COLOR: gray;
text-decoration: none;
}
.wrapper
{
width:760px;
margin:0 auto;
padding:10px;
}
#header
{
width:760px;
height: auto;
padding: 0;
}
#content
{
background: url(main.png) center top no repeat;
height:550px;
}
#footer
{
height:70px;
}
#menu
{
width:auto;
height:auto;
margin:0;
padding:5px;
list-style:none;
background:"img/viaggi1.jpg" top center no-repeat;
}
#menu li
{
display:inline;
margin:0;
padding:0 5px;
font-family: Arial, Helvetica, sans-serif;
color:gray;
}
h1
{
font-size:32px;
font-family: Arial, Helvetica, sans-serif;
color:black;
}
#leftbar
{
border-right:1px dashed gray;
width:130px;
height:550px;
padding:5px;
float:left;
}
#main_content
{
width:550px;
height:550px;
margin:0;
padding:5px;
float:left;
margin-left:25px;
font-size:12px;
}
#leftbar p, #main_content p
{
margin:5px 0;
font-size:12px;
}
#footer p
{
font-size:10px;
}
Grazie!!
