Problèmes css explorer

Résolu
ickyknox Messages postés 1156 Date d'inscription   Statut Membre Dernière intervention   -  
Lord Zero Messages postés 459 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

j'ai créé une feuille de style pour internet explorer.

Seulement il y a quelques détail que je n'arrive pas à modifier.

Par exemple, je veux une div avec du texte verte et un fond de couleur blanche.
Or, tout ce que j'ai c'est un texte de couleur noir sur fond transparent.

Pouvez vous m'aider s'il vous plait .

Voici ce que j'ai pour l'instant ; 

#cadretitre {
position:relative;
	clear: both;
	margin: 0 5%;
	padding: 1em 0 1em 1em;
	margin-top:10px;
  margin-left: auto;
		   z-index:2;
	}

#titre {
	background: #F9F9F9;
	display: table-row-group;
	padding: 1em;
	text-align: center;
	line-height:1em;
 	}

#titre h1 {
	font-family: BelleroseLight;
	font-weight: normal;
	font-size: 200%;
color: red;	}



Je vous remercie
A voir également:

4 réponses

Réponse 1 / 4
lionel-DIL Messages postés 1222 Date d'inscription   Statut Membre Dernière intervention   1 768
 
Bonsoir,

Pour mettre une couleur verte à un texte :

#titre {


color:#06DE38;
}
0
Lord Zero Messages postés 459 Date d'inscription   Statut Membre Dernière intervention   115
 
ou color:green;
mais rien ne vaut le code couleur
0
ickyknox Messages postés 1156 Date d'inscription   Statut Membre Dernière intervention   48
 
bonjour
justement j'ai mis color: red;

mais ca ne fonctionne pas
0
Lord Zero Messages postés 459 Date d'inscription   Statut Membre Dernière intervention   115
 
peux tu mettre le code complet, ou du moin la partie html css concernée?
0
ickyknox Messages postés 1156 Date d'inscription   Statut Membre Dernière intervention   48
 
ah oui exact.
Lord votre message m'a interpellé. Du coupo j'ai corrigé mon code.

Du coup, ma question va changer. 

<div class="ligne"></div>

<div id="cadretitre">
                                   
	<center><div id="titre"><h1>CONTACT?</h1></div></center>
			
</div>   


.ligne {
   width: 78%;
		   border-color	: #60ab0d;
		   border-width: 0 0 2px;
		   border-style: solid;
		   font-size: 0;
		   margin-top:33px;
		   margin-left:70px;
		   float:left;
		   position:absolute;
		   z-index:1;
}

 #cadretitre {
position:relative;
	clear: both;
	margin: 0 5%;
	padding: 1em 0 1em 1em;
	margin-top:10px;
  margin-left: auto;
		   z-index:2;
	}

#titre {
		   	   background: #F9F9F9;
	display: table-row-group;
	padding: 1em;
	text-align: center;
	line-height:1em;
 	}

#titre h1 {
	font-family: BelleroseLight;
	font-weight: normal;
	font-size: 200%;
color: #60ab0d;	}

#titre a {
	font-family: BelleroseLight;
	font-weight: normal;
	font-size: 130%;
color: #60ab0d;	}




déshormais, sur tous les navigateurs SAUF explorer, j'ai bien ce que je voulais, à savoir un titre : une ligne horizontale, et par dessus le titre (le tout de couleur verte)

Sur explorer, je n'ai que le titre, mais je n'ai pas la ligne.
Si je supprime le titre (cadretitre) du code html, je retrouve ma ligne.
Donc je suppose que le titre empiète sur la ligne.

Je tiens à préciser que ma ligne doit rester en arrière plan, car si elle est positionnée au 1er plan, mon titre sera barré.

merci encore pour votre aide
0
ickyknox Messages postés 1156 Date d'inscription   Statut Membre Dernière intervention   48
 
voici mon site pour voir l'apercu final que j'aimerais sur tous les navigateurs:
http://icreatorbeta.free.fr/contact.html
0
Réponse 2 / 4
Lord Zero Messages postés 459 Date d'inscription   Statut Membre Dernière intervention   115
 
Le problème vient du fait que ton cadretitre n'a pas de taille, pour Internet Explorer ton cadre fait toute la page, ta ligne est bien présente mais derrière cette énorme cadre., il faut donc faire un style pour Firefox et IE.

Le code suivant est testé sous IE7.
j'ai juste modifié cadretitre et ligne. 

<div class="ligne"></div>

<div id="cadretitre">
                                   
	<center><div id="titre"><h1>CONTACT?</h1></div></center>
			
</div>   

<style>

.ligne {
   width: 78%;
		   border-color	: #60ab0d;
		   border-width: 0 0 2px;
		   border-style: solid;
		   font-size: 0;
		   margin-top:33px;
		   margin-left:70px;
		   float:left;
		   position:absolute;
		   z-index:1;
}

 #cadretitre {
 width:100px;
position:relative;
	clear: both;
	margin: 0 5%;
	padding: 1em 0 1em 1em;
	margin-top:10px;
  margin-left: 500px;
		   z-index:2;
	}

#titre {
		   	   background: #F9F9F9;
	display: table-row-group;
	padding: 1em;
	text-align: center;
	line-height:1em;
 	}

#titre h1 {
	font-family: BelleroseLight;
	font-weight: normal;
	font-size: 200%;
color: #60ab0d;	}

#titre a {
	font-family: BelleroseLight;
	font-weight: normal;
	font-size: 130%;
color: #60ab0d;	}
</style>
<!--[if IE]>
<style>
.ligne {
   width: 78%;
		   border-color	: #60ab0d;
		   border-width: 0 0 2px;
		   border-style: solid;
		   font-size: 0;
		   margin-top:45px;
		   margin-left:-410px;
		   float:left;
		   position:absolute;
		   z-index:1;
}

 #cadretitre {
 width:100px;
position:relative;
	clear: both;
	margin: 0 5%;
	padding: 1em 0 1em 1em;
	margin-top:10px;
  margin-left: 500px;
		   z-index:2;
	}


</style>
<![endif]-->


Développeur VB6, VBS, VBA, VB.NET, C#, HTML, PHP, JAVASCRIPT, SQL.
0
Réponse 3 / 4
ickyknox Messages postés 1156 Date d'inscription   Statut Membre Dernière intervention   48
 
1000 merci lord zero !
En plus grace à ce conseil, j'ai compris pas mal de choses.
Merci !!
0
Lord Zero Messages postés 459 Date d'inscription   Statut Membre Dernière intervention   115
 
De rien, bonne continuation !
0
Réponse 4 / 4
alymira Messages postés 7 Date d'inscription   Statut Membre Dernière intervention  
 
Bonjour à tous,
Pouvez-vous m'aider svp?

Je débute en CSS et je rencontre quelques problèmes au niveau de l'alignement de mes blocs J'ai un menu à gauche en "float:left", et un bloc à sa droite, le corps, contenant tout mon texte.
Sous firefox et chrome, tout fonctionne bien, mais sous IE (euh je crois que c'est une veille version), mon corps se positionne en dessous du menu (diagonalement car je lui ai appliqué une marge).

J'ai lu qu'il fallait faire par exemple ceci en CSS:

************************ Début exemple code ************************
#div_menu{
float:left:
}

#div_contenu_page{
margin-left: 220px !mportant; /*Marge interprétée par firefox et chrome*/
margin-left: 110px; /*marge interprétée par IE, et vallant la moité de la marge
sous Firefox et chrome*/
}
************************ Fin exemple code ************************

Je l'ai fait... ça n'a rien changé :(.

Pourriez-vous m'aider svp, je sais plus quoi faire, j'ai tenté diverses choses sans succès :(

Merci
0
Lord Zero Messages postés 459 Date d'inscription   Statut Membre Dernière intervention   115
 
peux tu mettre le code entier ( html et css) de la partie concerné?
Pour t'aider, voici ma façon de faire :
1-Je code pour Firefox en premier (ex: style.css)
2-Je modifie pour IE (ex: style_ie.css)
3-J'utilise un "hack css" pour chrome et safari que je place dans mon style.css de firefox
ex : 
#ma_div { 
 height: 340px; 
 width: 1000px; 
 position: relative; 
 margin-left: 200px; 
} 
  
/* hack Chrome / Safari */ 
@media screen and (-webkit-min-device-pixel-ratio:0) { 
 #ma_div { 
  width: 600px; 
 } 
}

Source : http://glob.bargeo.fr/fr/web/css/hack-css-pour-google-chrome-et-safari/
0
lionel-DIL Messages postés 1222 Date d'inscription   Statut Membre Dernière intervention   1 768
 
Bonjour,

!mportant;
C'est !important qu'il faut mettre.
0
Lord Zero Messages postés 459 Date d'inscription   Statut Membre Dernière intervention   115
 
oh oui autant pour moi, pas vu la faute...
0

Discussions similaires

App explorer Sa sert a quoi ?
Mada_alpha -
SATS_fr -

1 réponse