relier feuille style css externe à la page html sur DW ? - Web design - Graphisme
Marsh Posté le 27-04-2006 à 14:38:03
J'ai oublié de dire qu' avant qu'on me réinstalle dreamweaver sur mon PC ça s'affichait comme il faut et puis là ça ne veut plus (?)
Là j'ai dreamweaver MX version éducation 6.0
Marsh Posté le 28-04-2006 à 09:39:12
Bonjour,
je n'ai pas lu ton code, mais à première vue, je dirais qu'il m'arrive des fois aussi que le style que j'écris, ne s'affiche pas sur DWV mais bien quand les tests sont faits en local. Si ton site s'affiche bien en local lors de tes tests, où est le problème?
Tu peux aussi nous afficher ton code html.
@+
Marsh Posté le 28-04-2006 à 09:58:39
Voici l'adresse de la page d'essai : http://www.ema.fr/~aima/test/test.html
J'ai créé cette page avec webexpert mais sur DW ça s'affiche comme ça :
Je prefererai que ça s'affiche correctement car je ne serai pas la seule à mettre à jour ce site et pour des gens qui ne s'y connaissent pas trop ce serait mieux.
Il n'y a pas une solution ? merci
Marsh Posté le 28-04-2006 à 10:39:41
Ho! Ho!
mais le probleme n'est pas DWV, c'est ton code. L'affichage aussi bien sur Firefox que Safari est catastrophique.
Je vais voir ton code car certaines choses ne sont pas claires.
Je te tiens au courant
@+
Marsh Posté le 28-04-2006 à 10:48:17
Je ne suis pas allé fort loin car déjà certaines choses sont bizaaaaaaaaaaaarre!!!
Avant tout:
supprime le
1)@charset "iso-8859-1";
2)dans ton style body{}
color:#0 ça n'a pas de sens; il faut au moins 3 chiffres. Si c'est du noir: color:#000;
3)ici:
Code :
|
Corrige toujours ça et on verra...
Marsh Posté le 28-04-2006 à 11:26:17
Ok merci mais mon problème n'est pas réglé, peut être à cause de cette version de dreamweaver ?
Marsh Posté le 28-04-2006 à 11:34:13
Dans ta feuille de style, au niveau .body {font-family}, tu as un espace qui ne sert à rien avant "sans-serif"
Marsh Posté le 28-04-2006 à 11:45:50
Tu as un problème avec tes <div></div>. J'en ai compté un nombre pair => il manque des fermetures, ce qui fait, à mon avis, un décalage dans les blocs.
Si tu t'y connais en html, essaie de vérifier.
De plus, tes <div> n'ont pas de positions spécifiques.
Tu as des sauts de lignes un peu partout.
Une bonne optimisation s'impose
Allez courage
@+
Marsh Posté le 28-04-2006 à 17:11:30
Le min-height et le _height ne sont pas faux, min-height c'est pour firefox (et les autres navigateurs respectant les standards) et ca permet d'indiquer une hauteur minimale a un bloc, seulement IE ne connais pas cette propriété et adapte au contenu d'ou le _height, firefox n'en tiens pas compte a cause du _ mais IE lui oui et donc il prendra comme hauteur celle spécifiée (et vu que par défaut si le contenu est plus grand il allonge le bloc c'est équivalent ^^).
Sinon vi une petite optimisation serait pas mal:
Code :
|
peut etre directement remplacé par un <ul id="Menu"> par exemple.
Il y a aussi des <br> ou <br /> un peu partout qu'il doit etre possible d'enlevé ainsi que des <font></font> qui n'ont pas a être dans la page html.
Voila
Marsh Posté le 28-04-2006 à 17:25:45
Cheinz a écrit : Le min-height et le _height ne sont pas faux, min-height c'est pour firefox (et les autres navigateurs respectant les standards) et ca permet d'indiquer une hauteur minimale a un bloc, seulement IE ne connais pas cette propriété et adapte au contenu d'ou le _height, firefox n'en tiens pas compte a cause du _ mais IE lui oui et donc il prendra comme hauteur celle spécifiée (et vu que par défaut si le contenu est plus grand il allonge le bloc c'est équivalent ^^). |
Merci de ce complément que j'ignorais totalement
Marsh Posté le 29-04-2006 à 15:43:46
Voila, j'ai réussi a rendre le truc compatible IE/Firefox mais pas opéra (je ne sais pas pourquoi...):
http://www.zeross.info/aiyana/
Voila voila si quelqu'un réussit a le rendre identique sur tout les navigateurs...
EDIT: Je précise que ca s'affiche relativement correctement dans ma version de Dreamweaver.
Marsh Posté le 29-04-2006 à 16:14:30
Bonjour,
Je confirme sur Mac:
aussi bien que Firefox, Safari, Camino et Opera, l'affichage est identique (correct) à part un petit détail:
la police est plus petite sur Opera(8.54) et Safari.
@+
Marsh Posté le 29-04-2006 à 16:17:37
Logique:
il n'y a pas de spécification dans la CSS quant à la taille de la police.
A ta place, je mettrais entre 12 et 14 px, ou alors joue sur les pt.
@+
Marsh Posté le 27-04-2006 à 14:34:48
Bonjour,
J'ai un petit problème, J'ai bien relié mon fichier de style css à la page html mais sur dreamweaver ça ne s'affiche pas comme il faut (menu superposé au texte), par contre sur ma page de test ça marche.
D'autres personnes mettront à jour ce site et ce serait plus simple que ça s'affiche correctement sur dreamweaver.
J'ai bien marqué ça sur la page html <link href="style.css" rel="stylesheet" type="text/css">
Voici le code du fichier css :
/* CSS Document */
@charset "iso-8859-1";
body {
background-color: #FFFFFF;
color: #0;
font-family: Verdana, Arial, Helvetica, ,sans-serif;
font-size: 15px;
}
a {
color: #000000;
text-decoration: underline;
}
h1 {
margin: 0;
padding: 0;
}
h2 {
font-family: Comic Sans MS,Verdana,Arial,Helvetica,sans-serif;
font-size: 25px;
color: #EB582C;
text-align: center;
}
h3 {
font-family: Times New Roman, Arial ;
font-size: 20px;
color: #FFD19B;
text-align: center;
}
h4 {
font-family: Times New Roman, Arial ;
margin-bottom: 0;
font-size: 20px;
color: #000000;
text-align: left;
}
img {
border: 0;
}
p {
text-align: justify;
text-indent: 15px;
}
p:first-letter {
font-weight: bold;
font-size: 16px;
color: #EB582C;
}
#Conteneur {
width: 765px;
margin: 0;
padding: 0;
border: 3px solid #000000;
background-image: url(beige107.jpg);
margin-left: auto;
margin-right: auto;
}
#Header {
background-image: url(beige107.jpg);
width: 760px;
height: 95px;
border-bottom: 1px solid #000000;
clear: both;
margin: 0;
padding: 0;
}
#ConteneurMenuContenu {
clear: both;
width: 100%;
}
#Menu {
background-image: url(beige107.jpg);
width: 125px;
float: left;
margin: 0;
}
#Contenu {
background-color: #FFFFFF;
border-left: 1px solid #000000;
width: 634px;
float: left;
padding: 5px;
margin: 0;
min-height: 650px;
_height: 650px;
}
#Footer {
clear: both;
border-top: 1px solid #000000;
background-color: #FFFFFF;
}
.ImageHeader {
float: left;
}
.ListeLiens {
padding: 0;
margin: 0;
text-align: center;
list-style-type: none;
}
.TexteCentre {
text-align: center;
}
.TexteAccueil {
text-align: center;
text-indent: 15px;
color: #003399;
font-weight : bold
}
.Bordure {
border-style: solid;
border-width: 3px;
}
#Copyright {
text-align: center;
color: #000000;
font-weight: bold;
}
Merci pour votre aide !
Message édité par aiyana le 27-04-2006 à 14:35:38