aiutooo con gli stili css esterni!!!!!!!

**kiuz** · 08-07-2004, 18:50

ciao ragazzi.. vi chiedo aiutooo perfavoree!!!
ho creato una pagina html costruendo al sua struttura con uno stile csse dei div... la prima pagina l'ho creata con uno stile css integrato...e fino qui tutto ok! la pagina perfetta sia in explorer sia in mozzila. ma appena ho provato ad esportare il codice dello stile css( che fin a quel momento era integrato nel codice della pagina html) in un file *.css esterno alla pagina ed infine importare lo stile nel codice htmla...

si è sballato tutto!!!!! epure il codice è identico....!!!!!!!!! l'unica differenza è che lo stile css è esterno!!!!! cosa è successo??????
perfavore aiutatemiiiiiiii
aiutooooooo

**Vre** · 08-07-2004, 19:01

Postaci il codice della pagina con il link al file .css

**Jerry Masslo** · 08-07-2004, 19:01

sballato in che senso? se non prende niente vuol dire che sbagli a lincarlo altrimenti ci dev'essere dell'altro, come lo colleghi alla pagina e cosa non ti prende?

**kiuz** · 08-07-2004, 19:20

**kiuz** · 08-07-2004, 19:25

ecco il codice con lo style integrato!!!

<!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>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">

body {
color:#333;
background-color:white;
margin:20px;
padding:0px;
font:11px verdana, arial, helvetica, sans-serif;
background-color: #000000;
}

h1 {
margin:0px 0px 15px 0px;
padding:0px;
font-size:28px;
font-weight:900;
color:#D2D2D2;
}

h2 {
font:bold 12px/14px verdana, arial, helvetica, sans-serif;
margin:0px 0px 5px 0px;
padding:0px;
color:#A2A2A2;
}

p {
font:11px/20px verdana, arial, helvetica, sans-serif;
margin:0px 0px 16px 0px;
padding:0px;
}

a {
color:#09c;
font-size:11px;
font-family:verdana, arial, helvetica, sans-serif;
font-weight:600;
text-decoration:none;
}

a:link {color:#FFFF00;}
a:visited {color:#800000;}
a:hover {background-color: none;
color:#ffffff;
font:underline;
text-decoration: underline;}

#box {
background-color: #000000;
background-image: url(sfondo.gif);
text-align: left;
width: 768px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
height: 100%;
}

#testata {
border:1px solid #c20000;
margin:0px;
padding0px;
height:156px;
background-color:#000000;
background-image: url(bdg.jpg);
}

#menusin {
float: left;
background-color: #000000;
background-image: url();
width: 113px;
height: 100%;
margin-top: 10px;
margin-right: 5px;
margin-bottom: 0px;
margin-left: 0px;
border: 1px dashed #c20000;
padding: 5px;
}

.homepage {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
background-color: #CCCCCC;
padding-left: 1px;
border-bottom: 1px solid #000000;
}

.menu {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
background-color: #000000;
}

.menu a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
text-decoration: none;
background-color: #c20000;
display: block;
width: auto;
border-bottom: 1px solid #000000;
border-right: 0px solid #000000;
border-left: 0px solid #000000;
border-top: 1px solid #FFFFFF;
padding: 1px;
}

.menu a:visited {
color: #000000;
background-color: #c20000;
}

.menu a:hover {
color: #ffff00;
background-color: #c20000;
text-decoration: none;
}

.preferiti {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
background-color: #FFFF00;
padding: 5px 1px 1px 1px;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
line-height: 1.5em;
}

.testopref {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
background-color: #00C200;
padding: 2px 1px 2px 1px;
}

#contenuto {
background-color: #000000;
background-image: url();
width: 486px;
float: left;
height: 100%;
margin-top: 10px;
margin-right: 5px;
margin-bottom: 5px;
margin-left: 5px;
border: 1px solid #ffffff;
padding: 5px;
}

#menudes {
background-color: #000000;
background-image: url();
background-repeat: repeat;
float: left;
width: 113px;
height: 100%;
margin-top: 10px;
margin-right: 0px;
margin-bottom: 5px;
margin-left: 5px;
border: 1px dashed #c20000;
padding: 5px;
}

</style>
</head>
<body>
<div id="box">

<div id="testata">
</div>

<div id="menusin">
<h2>Menu'</h2>
<div class="homepage">Home page</div>
<div class="menu">
identikit
articoli
link
forum
web master

</p>
</div>

<div class="preferiti">SITI AFFILIATI</div>
<div class="testopref">

fuoriluogo.com</p>

pastrugni.it</p>

html.pro</p>

drugs.com</p></div>

</div>

<div id="contenuto">
<h1>Contenuto</h1>

.........

<h2>Codice</h2>

...... ... ...... ........ ....... ....... ....... ....... </p>
</div>

<div id="menudes">
<h2>Menu destro</h2>

html.pro</p>

aaaaaaaaa</p>

aaaaaaaaa</p>

aaaaaaaaa</p>
</div>

</div>
</body>
</html>

ecco invece la pagina.... html e il codice dello stile esterno!

<!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>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">

body {
color:#333;
background-color:white;
margin:20px;
padding:0px;
font:11px verdana, arial, helvetica, sans-serif;
background-color: #000000;
}

h1 {
margin:0px 0px 15px 0px;
padding:0px;
font-size:28px;
font-weight:900;
color:#D2D2D2;
}

h2 {
font:bold 12px/14px verdana, arial, helvetica, sans-serif;
margin:0px 0px 5px 0px;
padding:0px;
color:#A2A2A2;
}

p {
font:11px/20px verdana, arial, helvetica, sans-serif;
margin:0px 0px 16px 0px;
padding:0px;
}

a {
color:#09c;
font-size:11px;
font-family:verdana, arial, helvetica, sans-serif;
font-weight:600;
text-decoration:none;
}

a:link {color:#FFFF00;}
a:visited {color:#800000;}
a:hover {background-color: none;
color:#ffffff;
font:underline;
text-decoration: underline;}

#box {
background-color: #000000;
background-image: url(sfondo.gif);
text-align: left;
width: 768px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
height: 100%;
}

#testata {
border:1px solid #c20000;
margin:0px;
padding0px;
height:156px;
background-color:#000000;
background-image: url(bdg.jpg);
}

#menusin {
float: left;
background-color: #000000;
background-image: url();
width: 113px;
height: 100%;
margin-top: 10px;
margin-right: 5px;
margin-bottom: 0px;
margin-left: 0px;
border: 1px dashed #c20000;
padding: 5px;
}

.homepage {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
background-color: #CCCCCC;
padding-left: 1px;
border-bottom: 1px solid #000000;
}

.menu {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
background-color: #000000;
}

.menu a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
text-decoration: none;
background-color: #c20000;
display: block;
width: auto;
border-bottom: 1px solid #000000;
border-right: 0px solid #000000;
border-left: 0px solid #000000;
border-top: 1px solid #FFFFFF;
padding: 1px;
}

.menu a:visited {
color: #000000;
background-color: #c20000;
}

.menu a:hover {
color: #ffff00;
background-color: #c20000;
text-decoration: none;
}

.preferiti {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
background-color: #FFFF00;
padding: 5px 1px 1px 1px;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
line-height: 1.5em;
}

.testopref {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
background-color: #00C200;
padding: 2px 1px 2px 1px;
}

#contenuto {
background-color: #000000;
background-image: url();
width: 486px;
float: left;
height: 100%;
margin-top: 10px;
margin-right: 5px;
margin-bottom: 5px;
margin-left: 5px;
border: 1px solid #ffffff;
padding: 5px;
}

#menudes {
background-color: #000000;
background-image: url();
background-repeat: repeat;
float: left;
width: 113px;
height: 100%;
margin-top: 10px;
margin-right: 0px;
margin-bottom: 5px;
margin-left: 5px;
border: 1px dashed #c20000;
padding: 5px;
}

</style>
</head>
<body>
<div id="box">

<div id="testata">
</div>

<div id="menusin">
<h2>Menu'</h2>
<div class="homepage">Home page</div>
<div class="menu">
identikit
articoli
link
forum
web master

</p>
</div>

<div class="preferiti">SITI AFFILIATI</div>
<div class="testopref">

fuoriluogo.com</p>

pastrugni.it</p>

html.pro</p>

drugs.com</p></div>

</div>

<div id="contenuto">
<h1>Contenuto</h1>

.........

<h2>Codice</h2>

...... ... ...... ........ ....... ....... ....... ....... </p>
</div>

<div id="menudes">
<h2>Menu destro</h2>

html.pro</p>

aaaaaaaaa</p>

aaaaaaaaa</p>

aaaaaaaaa</p>
</div>

</div>
</body>
</html>

codice style ###############

<style type="text/css">

body {
color:#333;
margin: auto;
padding:0px;
font:11px verdana, arial, helvetica, sans-serif;
background-color:#000000;
}

h1 {
margin:0px 0px 15px 0px;
padding:0px;
font-size:28px;
font-weight:900;
color:#D2D2D2;
}

h2 {
font:bold 12px/14px verdana, arial, helvetica, sans-serif;
margin:0px 0px 5px 0px;
padding:0px;
color:#A2A2A2;
}

p {
font:11px/20px verdana, arial, helvetica, sans-serif;
margin:0px 0px 16px 0px;
padding:0px;
}

a {
color:#09c;
font-size:11px;
font-family:verdana, arial, helvetica, sans-serif;
font-weight:600;
text-decoration:none;
}

a:link {color:#FFFF00;}
a:visited {color:#800000;}
a:hover {background-color: none;
color:#ffffff;
font:underline;
text-decoration: underline;}

#box {
background-color: #000000;
background-image: url(sfondo.gif);
text-align: left;
width: 768px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
height:auto;
}

#testata {
border:1px solid #c20000;
margin:0px;
padding:0px;
height:156px;
background-color:#000000;
background-image: url(bdg.jpg);
}

#menusin {
float: left;
background-color: #000000;
background-image: url(sfondo.gif);
width: 113px;
height: 100%;
margin-top: 10px;
margin-right: 5px;
margin-bottom: 0px;
margin-left: 0px;
border: 1px dashed #c20000;
padding: 5px;
}

.homepage {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
background-color: #CCCCCC;
padding-left: 1px;
border-bottom: 1px solid #000000;
}

.menu {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
background-color: #000000;
}

.menu a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
text-decoration: none;
background-color: #c20000;
display: block;
width: auto;
border-bottom: 1px solid #000000;
border-right: 0px solid #000000;
border-left: 0px solid #000000;
border-top: 1px solid #FFFFFF;
padding: 1px;
}

.menu a:visited {
color: #000000;
background-color: #c20000;
}

.menu a:hover {
color: #ffff00;
background-color: #c20000;
text-decoration: none;
}

.preferiti {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #000000;
background-color: #FFFF00;
padding: 5px 1px 1px 1px;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
line-height: 1.5em;
}

.testopref {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
background-color: #00C200;
padding: 2px 1px 2px 1px;
}

#contenuto {
background-color: #000000;
width: 486px;
float: left;
height: 100%;
margin-top: 10px;
margin-right: 5px;
margin-bottom: 5px;
margin-left: 5px;
border: 1px solid #ffffff;
padding: 5px;
}

#menudes {

background-color: #000000;
background-image: url(sfondo.gif);
background-repeat: repeat;
float: left;
width: 113px;
height: 100%;
margin-top: 10px;
margin-right: 0px;
margin-bottom: 5px;
margin-left: 5px;
border: 1px dashed #c20000;
padding: 5px;
}

</style>

capito????

**Jerry Masslo** · 08-07-2004, 20:06

ma la pagina con lo stile esterno che non vedo linkato ha sia l'esterno che l'interno? o hai fatto casino col copia e incolla? comunque lo stile esterno non lo devi mettere tra tag, lì tag non ce ne vanno

**kiuz** · 09-07-2004, 17:15

allora tu dici che questo:
<style type="text/css">
</style>
non va nello stile... ed infatto appena tolto va molto meglio...

###########
e comunque ecco la pagina con il css linkato:
###########

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">

</style>
</head>
<body>
<div id="box">

<div id="testata">
</div>

<div id="menusin">
<h2>Menu'</h2>
<div class="homepage">Home page</div>
<div class="menu">
identikit
articoli
link
forum
web master

</p>
</div>

<div class="preferiti">SITI AFFILIATI</div>
<div class="testopref">

fuoriluogo.com</p>

pastrugni.it</p>

html.pro</p>

drugs.com</p></div>

</div>

<div id="contenuto">
<h1>Contenuto</h1>

.........

<h2>Codice</h2>

........... </p>
</div>

<div id="menudes">
<h2>Menu destro</h2>

html.pro</p>
</div>

</div>
</body>
</html>

si noti all'inizio.. come l'ho linkato :

<style type="text/css">

</style>

giusto?????

**Jerry Masslo** · 09-07-2004, 23:43

il tuo dovrebbe andare bene, a parte che il commento html non so se può dare qualche problema, comunque io faccio così:

<link rel="stylesheet" type="text/css" media="all" href="TuoStile.css">

in ogni caso ora cos'ha che non va.

**kiuz** · 10-07-2004, 16:30

ok intanto provero con quella modifica. prova ad eseguire il codice... cosiì vedi il casino che succede!
avevo provatoa cattura immagini dello schermo ma sono troppo grandi e non me li allega!... adesso è tardi e devo andare... la prossima volta.. te lia lleghero e vedari le differenze che io vedo! sono veramente enormi!!!

Discussione: aiutooo con gli stili css esterni!!!!!!!

Strumenti discussione

Ricerca discussione

Visualizza

aiutooo con gli stili css esterni!!!!!!!

.....

hai ragione...la secondo pagina non l'ho copiata correttamente!

...

Permessi di invio