relier feuille style css externe à la page html sur DW ?

relier feuille style css externe à la page html sur DW ? - Web design - Graphisme

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
Reply

Marsh Posté le 27-04-2006 à 14:34:48   

Reply

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

Reply

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.
 
@+


Message édité par oualad le 28-04-2006 à 09:40:50

---------------
Un forum étant un lieu d'échange, j'accepte les MP uniquement pour les rendez-vous coquins - Imac PPC G3 350Mhz Mac OS X 10.3.9
Reply

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 :
 
http://www.ema.fr/~aima/test/page_dream.jpg  
 
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

 

Reply

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
@+


---------------
Un forum étant un lieu d'échange, j'accepte les MP uniquement pour les rendez-vous coquins - Imac PPC G3 350Mhz Mac OS X 10.3.9
Reply

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 :
  1. #Contenu {
  2. background-color: #FFFFFF;
  3. border-left: 1px solid #000000;
  4. width: 634px;
  5. float: left;
  6. padding: 5px;
  7. margin: 0;
  8. min-height: 650px; /* c'est quoi min-height */
  9. _height: 650px;  /* il faut mettre height et pas _height*/
  10. }


 
Corrige toujours ça et on verra...


Message édité par oualad le 28-04-2006 à 10:49:53

---------------
Un forum étant un lieu d'échange, j'accepte les MP uniquement pour les rendez-vous coquins - Imac PPC G3 350Mhz Mac OS X 10.3.9
Reply

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 ?

Reply

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"
 


---------------
Un forum étant un lieu d'échange, j'accepte les MP uniquement pour les rendez-vous coquins - Imac PPC G3 350Mhz Mac OS X 10.3.9
Reply

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 :wahoo:  
Allez courage :hello:  
 
@+


Message édité par oualad le 28-04-2006 à 11:49:12

---------------
Un forum étant un lieu d'échange, j'accepte les MP uniquement pour les rendez-vous coquins - Imac PPC G3 350Mhz Mac OS X 10.3.9
Reply

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 :
  1. <div id="Menu">    <br />
  2.                 <ul class="ListeLiens">
  3. ...
 

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

Message cité 1 fois
Message édité par Cheinz le 28-04-2006 à 17:12:39
Reply

Marsh Posté le 28-04-2006 à 17:11:30   

Reply

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 :jap:  


---------------
Un forum étant un lieu d'échange, j'accepte les MP uniquement pour les rendez-vous coquins - Imac PPC G3 350Mhz Mac OS X 10.3.9
Reply

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.


Message édité par Cheinz le 29-04-2006 à 15:54:30
Reply

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.
 
@+
 


---------------
Un forum étant un lieu d'échange, j'accepte les MP uniquement pour les rendez-vous coquins - Imac PPC G3 350Mhz Mac OS X 10.3.9
Reply

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.
 
@+


---------------
Un forum étant un lieu d'échange, j'accepte les MP uniquement pour les rendez-vous coquins - Imac PPC G3 350Mhz Mac OS X 10.3.9
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed