Salve, premetto che il mio mestiere è disegnare e non fare siti ma, il mio sito ho voluto costruirmrlo personalmente.
Lavoro con il Mac e il browser che uso è SAFARI ho anche IE5 ma so che non viene nemmeno considerato tale, quindi lo escludo.
Per costruire il mio nuovo sito ho usato XHTML e CSS ma, mettendolo online SAFARI non lo visualizza, fa vedere solo lo sfondo che ho dato al tag BODY e in IE so che si visualizza un pasticcio, (ho chiesto ad un amico che possiede un PC con IE).
Ora vi espongo la mia INDEX e il foglio CSS per capire dove sono gli errori, premetto che ho fatto validazione nel sito www.wc3.org la mia index ed è valida, non ci sono errori, quindi il danno stà nel CSS...presumo.
L'inirizzo del sito in questione è: www.figuriniepiccoleillustrazioni.info
Allego anche un'immagine di come è il sito che ho progettato e come lo visualizza Safari ofline.
Grazie anticipato a chi vorra darmi una mano,
Patrizia
Index:
<?xml version="1.0" encoding="ISO-8859-1"?>
<!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>
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1"/>
<meta name="author" content="Patrizia Magni Stilista Figurinista Illustratore"/>
<title>Figurini e piccole Illustrazioni</title>
<link rel="stylesheet" type="text/css" href="stilepat.css" />
</head>
<body>
<table cellspacing="0" cellpadding="0">
<tr><td><iframe src="home.html" name="home" class="home" marginheight="0" marginwidth="0"></iframe></td>
<td class="menu1">
<div id="menu">
<ul>[*]Home[*]Figurini giorno[*]Fifurini sera-sposa[*]Figurini bimbi[*]Accessori moda[*]Storia del Costume[*]Illustrazioni varie[*]L'Anatomia[*]Bio[/list]
</div>
</td></tr>
<tr><td><iframe src="menu2.html" name="menu2" class="menu2" marginheight="0" marginwidth="0"></iframe></td></tr>
<tr><td class="col">Gli scritti e le immagini sono di proprietà di Patrizia Magni, è fatto espresso divieto di utilizzo da parte di terzi.</td><td class="cole">E - MAIL</td></tr>
</table>
</body>
</html>
CSS:
body {
background-color: #dcdcdc;
font-family: times new roman,san serif,helvetica;
font-size: 10px;
color: #333333;
border: 0 none;
padding: 0;
text-align: center;
}
a {
text-decoration: none;
}
a:link {
background-color: #333333;
text-decoration: none;
color: #ffffff;
}
a:visited {
background-color: #333333;
text-decoration: none;
color: #dcdcdc;
}
a:hover {
background-color: #333333;
text-decoration: none;
color: #e33639;
}
able{
background-color: #333333;
width: 600px;
height: 355px;
padding:0;
border:0 none;
text-align:center;
}
.menu1 {
background-color: #bebebe;
width: 145px;
height: 435px;
position: absolute;
}
.col {
background-color: #bebebe;
color: #333333;
width: 600px;
height: 12px;
padding-left: 5px;
position: absolute;
}
.cole {
background-color: #333333;
color: #e33639;
width: 145px;
height: 12px;
padding: 0;
margin-left: 600px;
text-align: center;
position:absolute;
}
/*iframe1*/
.home {
background-color: #333333;
width: 600px;
height: 355px;
padding: 0;
border: 0 none;
}
/*iframe2*/
.menu2 {
width: 600px;
height: 80px;
padding-top: 0;
border: 0 none;
}
#p {
font-family: times new roman, san serif, helvetica;
font-size: 13px;
text-align: justify;
color: #333333;
position: absolute;
left: 30px;
right: 30px;
}
div#menu {
float: right;
margin 0 auto;
}
div#menu ul {
list-style-type: none;
margin: 0;
padding: 0;
}
div#menu li {
margin: 0 0 15px;
padding: 0;
font-size: 14px;
}
div#menu a {
display: block;
width: 140px;
height: 18px;
line-height: 18px;
text-decoration: none;
text-indent: 15px;
background: url ("img/link.gif") no repeat top left;
color: #ffffff;
font-variant: small-caps;
}
div#menu a:hover {
color: #e33639;
}
div#menu li#active {
disply: block;
width: 140px;
height: 25px; line-height: 25px;
text-decoration: none;
text-indent: 20px;
color: #ffffff;
font-weight: bold;
font-variant: small-caps;
}
.esterna {
background-color: #333333;
}
/*inizio rollover*/
img{
border-width: 0
}
div#bottone ul {
list-style-type: none;
margin: 0;
padding-left: 0px;
padding-top: 10px;
}
div#bottone li {
float: left;
margin: 0;
padding-right: 8px;
}
div#bottone a {
display: block;
}
div#bottonen a:hover {
line-height: 0px; /*serve per IE*/
}
div#bottone a:hover img{
visibility: hidden;
}
div#bottone a#current:hover img{
visibility: hidden;
}
li#s1 {
background: url("img/faraonecol.gif") no-repeat top left;
}
li#s2 {
background: url("img/500col.gif") no-repeat top left;
}
li#s3 {
background: url("img/570col.gif") no-repeat top left;
}
li#f4 {
background: url("img/1600col.gif") no-repeat top left;
}
li#s5 {
background: url("img/1200col.gif") no-repeat top left;
}
li#s6 {
background: url("img/1539col.gif") no-repeat top left;
}
li#s1 {
background: url("img/velorcol.gif") no-repeat top left;
}
li#s2 {
background: url("img/corsettocol.gif") no-repeat top left;
}
li#s3 {
background: url("img/spaventocol.gif") no-repeat top left;
}
li#s4 {
background: url("img/angolocol.gif") no-repeat top left;
}
li#s5 {
background: url("img/profilicol.gif") no-repeat top left;
}
li#s6 {
background: url("img/egittocol.gif") no-repeat top left;
}
li#s7 {
background: url("img/anni70col.gif") no-repeat top left;
}
li#a1 {
background: url("img/anatocol.gif") no-repeat top left;
}
li#i1 {
background: url("img/pescecol.gif") no-repeat top left;
}
li#i2 {
background: url("img/cinpatcol.gif") no-repeat top left;
}
li#i3 {
background: url("img/cicognacol.gif") no-repeat top left;
}
li#i4 {
background: url("img/tempocol.gif") no-repeat top left;
}
li#i5 {
background: url("img/vinocol.gif") no-repeat top left;
}
li#i6 {
background: url("img/peck1col.gif") no-repeat top left;
}
li#i7 {
background: url("img/peck2col.gif") no-repeat top left;
}
li#i8 {
background: url("img/peck3col.gif") no-repeat top left;
}
li#i9 {
background: url("img/alberocol.gif") no-repeat top left;
}
li#i10 {
background: url("img/bimbacol.gif") no-repeat top left;
}
li#i11 {
background: url("img/zuppieracol.gif") no-repeat top left;
}
li#i12 {
background: url("img/acquacol.gif") no-repeat top left;
}