Probleme CSS

3 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Probleme CSS

Message par mimi-76- Mar 17 Avr 2012 - 16:54

Bonjour,
forum phpbb2
css et template modifier
forum: http://funnycraft.forumpro.fr

Bonjour voila mon problème c'est que mon css ne fonctionne pas sous IE, moi j'utilise google chrome mais les autres sont différent.

Voici mon css:
Code:
/*menu1*/
.navig {
border-radius: 10px 10px 0 0px;
top: 0px;
width: 100%;
  background-color: #B7E1EF;
  border-top: 3px solid #A1D5E6;
}
/*menu2*/

/*liste des menus*/

#menu ul{padding: 0px;
    list-style-type: none;
margin: 0px;
}
 
/*positionnement des menus*/
#menu dl {
    float: left;
    width: 150px;margin:auto;
padding:0; }
 
/*menus*/
#menu dt {
    color: blue;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    background: #A1D5E6;
    border: 1px solid black;
    margin: 0px;
border-radius: 10px 10px 0 0px;}
 
/*menus au survol*/
#menu dt:hover{
    border-bottom: none!important;}
 
/*liste des sous-menus*/
#menu dd {
    display: none;
    border: 1px solid gray;
    border-top: none!important;
    background: #A1D5E6;
    margin: 0px;
    padding: 0px;
    list-style-type:none;}
 
#menu li {
    text-align: center;
    background: grey;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
/* liens des sous-menus*/
#menu li a, #menu dt a {
    color: black;
    background: #A1D5E6;
    text-decoration: none;
    display: block;
    height: 100%;
    border: 0 none;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}
 
/*liens des sous-menus au survol*/
#menu li a:hover, #menu li a:focus, #menu dt a:hover, #menu dt a:focus {
    color: white;
    text-align: center;
    width: 150px;
    cursor: pointer;
    font-weight: bold;
    background: gray;
    margin: 0px;
    padding: 0px;
    list-style-type: none;}

/* masquer chatbox*/
.elt_declancheur
{
    border-radius: 10px 10px 0 0px;
  border: 1px solid black;
}

 /* rond petit */
input {
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;}

                                                  /* tableau multi */

/* #tab-bloc = ce tableau d'onglet / .tabs = conteneur des onglets */
#tab-bloc .tabs {
  text-align: center;
  margin-bottom: 10px;
}
/* .tab = onglets */
#tab-bloc .tab {
  border-radius: 5px;
  border: 1px solid green;
  margin: 0 20px;
  background: none;
}
/* .tab.selected = onglet sélectionné*/
#tab-bloc .tab.selected {
  background: #111;
  box-shadow: 0 0 5px #333;
  color: #eee;
  font-weight: bold;
}
/* .tab img = image dans les onglets */
#tab-bloc .tab img {
  vertical-align: -3px;
}
/* .contents = conteneur des contenu */
#tab-bloc .contents {
  border: 3px double #aaa;
  background: #eee;
  border-radius: 50px;
  padding: 25px;
}
/* #tab-staff = contenu associé à l'onglet staff */
#tab-staff {
  background: url();
  border-radius: 50px;
  border: 2px dashed #bbb;
 
}
#tab-staff table {
  color: #444;
  background: url(http://i.imgur.com/GEdKG.png);
  margin: 100px auto;
  font-weight: 30px;
  opacity: 0.8;
  border: 2px solid #ccc;
  border-radius: 5px;
}
/* #tab-bienvenue = contenu associé à l'onglet bienvenue */
#tab-bienvenue {
  border-radius: 50px;
  border: 2px dashed #bbb;
  background: url();
  text-align: center;
  font-size: 20px;
  color: #333;
  text-shadow: 0 0 5px #fff;
}
/* #tab-bienvenue marquee = le marquee dans l'onglet bienvenue */
#tab-bienvenue marquee {
  width: 400px;
  text-align: center;
}
/* #tab-regles = contenu associé à l'onglet règles */
#tab-regles ul  {
  font-family: georgia, arial, serif;
  font-size: 17px;
  list-style: url(http://i.imgur.com/DMC6G.gif);
 
}
#tab-regles li {
  margin-bottom: 10px;
  color: green;
}


Dernière édition par mimi-76- le Ven 20 Avr 2012 - 20:09, édité 1 fois
mimi-76-

mimi-76-
****

Messages : 279
Inscrit(e) le : 14/03/2012

http://lord-of-cubs.jeun.fr
mimi-76- a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par Threax Mar 17 Avr 2012 - 17:47

Bonjour,

Quelle partie du CSS ne fonctionne pas ?
border-radius, par exemple, n'est interprété que par les versions les plus récentes des navigateurs modernes (soit tout sauf IE, en clair).
Les versions un peu plus anciennes de Firefox, par exemple (3.6), d'Opéra... nécessitent des codes spécifiques pour que border-radius fonctionne pour tous :
Code:
-moz-border-radius: 10px 10px 0 0px;
-webkit-border-radius: 10px 10px 0 0px;
-o-border-radius: 10px 10px 0 0px;
-ms-border-radius: 10px 10px 0 0px;
border-radius: 10px 10px 0 0px;
Threax

Threax
Membre actif

Masculin
Messages : 17276
Inscrit(e) le : 27/08/2005

http://lesforumsde.forumactif.com
Threax a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par mimi-76- Mar 17 Avr 2012 - 18:40

Est ce que si j'ajoute votre code ceci modifierais tout.
mimi-76-

mimi-76-
****

Messages : 279
Inscrit(e) le : 14/03/2012

http://lord-of-cubs.jeun.fr
mimi-76- a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par Threax Mar 17 Avr 2012 - 19:00

Non.
Je vous explique que pour chaque "border-radius" trouvé dans votre CSS, il faudrait intégrer les variantes pour les autres navigateurs. Ainsi que pour toutes les propriétés CSS3.

Une petite rechercher sur Google devrait vous permettre d'avoir des explications précises.
Threax

Threax
Membre actif

Masculin
Messages : 17276
Inscrit(e) le : 27/08/2005

http://lesforumsde.forumactif.com
Threax a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par mimi-76- Mar 17 Avr 2012 - 19:11

Bas je vous remercie, j'ai déjà chercher sur google mais je comprend pas grand chose
mimi-76-

mimi-76-
****

Messages : 279
Inscrit(e) le : 14/03/2012

http://lord-of-cubs.jeun.fr
mimi-76- a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par Manumanu Mar 17 Avr 2012 - 23:44

Bonjour,

Le problème, c'est que forumactif ajoute par défaut une balise meta (qui n'a rien à faire là et qui ne devrait pas y être, si un responsable lis ça et peut le faire remonter) qui force l'affichage d'IE en mode compatibilité antérieure...

Va dans ton fichier overall_header et supprime la balise qui ressemble à ça :
Code:
<meta http-equiv="X-UA-Compatible" content="{}" />

Tout rentrera dans l'ordre pour IE9 et 10, qui ne s'afficheront plus avec le moteur de rendu d'IE8.

@ Threax: Autant pour les propriétés pas encore implémentées, les préfixes propriétaires ont une utilité, autant pour border-radius, il est largement temps de les oublier. Wink
Attention d'ailleurs, le préfixe -htm- n'existe pas.
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par Threax Jeu 19 Avr 2012 - 12:17

Bonjour,

Si cette balise a été implémentée, ce n'est pas pour rien. Libre à vous de l'enlever via le template overall_header, en effet. Wink

@ Threax: Autant pour les propriétés pas encore implémentées, les préfixes propriétaires ont une utilité, autant pour border-radius, il est largement temps de les oublier. Wink
Attention d'ailleurs, le préfixe -htm- n'existe pas.
J'ai pris border-radius parce que c'est le premier que j'ai vu dans le CSS donné, mais je ne suis pas d'accord avec vous sur l'abandon des préfixes propriétaires pour cette propriété. Quand on sait le nombre de personnes qui ne mettent pas à jour leur navigateur, ça ne coûte rien de les utiliser encore quelque temps pour les retardataires. Wink

Il suffit de voir ce graphique pour se rendre compte qu'en début d'année, des navigateurs tels que IE6, IE7 ou FF 3.6 étaient encore utilisés.
Probleme CSS Barometre-navigateur-2012-detail
Même si IE n'est pas concerné par ces préfixes, c'est tout de même significatif.
Threax

Threax
Membre actif

Masculin
Messages : 17276
Inscrit(e) le : 27/08/2005

http://lesforumsde.forumactif.com
Threax a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Probleme CSS

Message par Manumanu Jeu 19 Avr 2012 - 12:45

C'est un point de vue qui fait régulièrement l'objet de débats passionnés ^^. Mais pour moi, supporter les anciennes versions, c'est retarder leur disparition. Mais là, on est un peu en hors-sujet (cela dit si ça intéresse quelqu'un, je veux bien en parler ailleurs !).

Par contre pour la balise, je veux bien qu'on m'indique une raison à son implémentation. C'est un paliatif à court terme pour les applications-métier développées pour IE6 à l'époque (qui fournissait des outils de gestion et de déploiement qu'aucun autre navigateur ne possède encore aujourd'hui), afin d'assurer la compatibilité avec celles-ci dans les nouveaux navigateurs. Ça n'a pas de rapport avec les sites, surtout des sites développés aujourd'hui. Dans le mode d'utilisation appliqué ici, elle bloque en plus l'utilisation de versions récentes d'IE.
Du coup, je veux bien une explication Smile
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par Threax Ven 20 Avr 2012 - 18:04

Tout ce que je peux vous dire, c'est que lorsque cette balise a été implémentée, c'était parce que la nécessité s'en était fait ressentir. Est-ce qu'une telle nécessité est encore présente aujourd'hui, je n'ai pas de réponse à vous proposer, je demanderai à un Dévactif de s'y pencher à l'occasion. Wink

mimi-76- Arrow Votre problème est-il résolu ?
Threax

Threax
Membre actif

Masculin
Messages : 17276
Inscrit(e) le : 27/08/2005

http://lesforumsde.forumactif.com
Threax a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par mimi-76- Ven 20 Avr 2012 - 18:06

En suppriment cette balise, je trouve que sur IE c'est plus joli a voir !
mimi-76-

mimi-76-
****

Messages : 279
Inscrit(e) le : 14/03/2012

http://lord-of-cubs.jeun.fr
mimi-76- a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par Manumanu Ven 20 Avr 2012 - 18:09

Parce qu'IE ne se met plus en mode de compatibilité inférieure. Wink

@Threax: Très bien, merci beaucoup pour cette réponse, quoi qu'il soit décidé par les décideurs. Wink
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par Threax Ven 20 Avr 2012 - 18:52

Threax a écrit:mimi-76- Arrow Votre problème est-il résolu ?
Siffleur
Threax

Threax
Membre actif

Masculin
Messages : 17276
Inscrit(e) le : 27/08/2005

http://lesforumsde.forumactif.com
Threax a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Probleme CSS

Message par mimi-76- Ven 20 Avr 2012 - 20:07

Oui, et non mais c'est déjà mieux mais on peut pas tout régler .

Problème résolu.
mimi-76-

mimi-76-
****

Messages : 279
Inscrit(e) le : 14/03/2012

http://lord-of-cubs.jeun.fr
mimi-76- a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum