<!--[if Opera]> [Réglé]
Possible ?
Support Général
Wootbike Membre non connecté
Booster Fronde
-
Booster Fronde
- Voir le profil du membre Wootbike
- Inscrit le : 13/08/2010
Une présentation s'impose sachant que je suis nouveau.
Je m'appelle Kévin, j'ai bientôt 20 ans et part dans une école de multimédia à la rentrée à Paris. En attendant de partir au mois d'Octobre, je créé un petit site sur phpboost.
Avant d'expliquer mon problème, je tiens à féliciter toute l'équipe qui à créer ce CMS et aussi tous les autres qui aident la communauté à s'en sortir.
Commençons. Je viens donc de créer un petit site en local et essai de faire mon propre design. Malheuresement, le corps de ma page est décalé sur la droite mais que sur Opéra tandis que sur les autres navigateurs, tout marche niquel.
Screenshots pour montrer le problème :
Sous Opera :

Sous Firefox/safari :

Ce que je me demandais, c'était savoir si dans "design.css", il serait possible de créer un deuxième body mais pour le navigateur Opéra ?
Amicalement,
Édité par Wootbike Le 15/08/2010 à 19h37
ReidLos Membre non connecté
-
Modérateur
- Voir le profil du membre ReidLos
- Inscrit le : 27/02/2009
- Site internet
- Groupes :
-
Equipe Développement

Je vais commencer en donnant mon point de vue.
Ce type de condition doit être utilisés avec modération.
Le problème que tu as peut largement être réglé sans recréer une autre fichier CSS.
Ca favorise le bafouillage de tout le code, et au final, faire quelque chose en 4 fois alors que ca pourrait le faire avec un seul.
Je ne te conseil donc pas cette pratique, mais plutôt la recherche de l'erreur.
Ton site est il en ligne ?
Wootbike Membre non connecté
Booster Fronde
-
Booster Fronde
- Voir le profil du membre Wootbike
- Inscrit le : 13/08/2010
J'ai lu que utiliser cette fonction était appelé comme du "Hack". Bref, je ne vois pas comment faire pour modifier le body sous Opéra sans le modifier sous les autres navigateurs.
Je vous remercie de votre aide qui me sera précieuse.
Wootbike Membre non connecté
Booster Fronde
-
Booster Fronde
- Voir le profil du membre Wootbike
- Inscrit le : 13/08/2010
ReidLos Membre non connecté
-
Modérateur
- Voir le profil du membre ReidLos
- Inscrit le : 27/02/2009
- Site internet
- Groupes :
-
Equipe Développement
Wootbike Membre non connecté
Booster Fronde
-
Booster Fronde
- Voir le profil du membre Wootbike
- Inscrit le : 13/08/2010
Sous Opéra, le corps se décale sur la droite alors que sur les autres navigateurs, le corps est correctement placé ; donc je voudrais savoir s'il y a une solution à ce problème, comme créer une deuxième feuille css spécialement pour Opéra.
Voulez-vous que je vous colle le global.css ou design.css ?
Je m'excuse encore, amicalement.
ReidLos Membre non connecté
-
Modérateur
- Voir le profil du membre ReidLos
- Inscrit le : 27/02/2009
- Site internet
- Groupes :
-
Equipe Développement
Wootbike Membre non connecté
Booster Fronde
-
Booster Fronde
- Voir le profil du membre Wootbike
- Inscrit le : 13/08/2010
Caché :
Code CSS :
* { margin:0; padding:0; font-size:100%; } body { background:#000 url(images/global.png) repeat-x; height:343px; font-size:12px; font-family:"Berlin Sans SD",Arial,Helvetica,sans-serif; color:#000; margin:0; padding:0; } /* Conteneurs --------------------------------------*/ /* ##### Conteneur global du site ###### */ div#global { /* Extensible margin:auto 5px; margin-bottom:15px; */ width:90%; margin:auto; } /* ##### Entéte de la page ###### */ div#header_container,div#header_admin_container { background: url(images/header.png) no-repeat; background-position:20px 0px; margin-bottom:8px; height:300px; } /* ##### Entéte de la page ###### */ div#header,div#header_admin { height:90px; } /* ##### Conteneur en dessous de l'entéte ###### */ div#sub_header,div#sub_header_admin { background: url(images/sub_header.png) no-repeat; margin:auto; margin-top:8px; margin-bottom:40px; padding:0; height:195px; padding-left:5px; } div#sub_header p a { color:#FFFFFF; } div#sub_header a:hover { color:#FFF; text-decoration : none; } div#date { height:50px; width:50px; position:relative; top:22px; left:35px; } div#date p { text-align:center; color:white; font-size:14px; padding:0px; margin:0px; } div#help { height:110px; width:400px; position:relative; top:-52px; left:200px; } div#help p { text-align:center; color:white; font-size:12px; padding:0px; margin:-10px; margin-top:5px; margin-right:15px; } div#last_new { height:110px; width:195px; position:relative; top:-142px; left:700px; } div#last_new p { text-align:center; color:white; font-size:12px; padding:0px; margin:0px; margin-top:5px; margin-right:15px; } div#sub_header .dynamic_menu { position:relative; top:115px; } div#sub_header p a { color:#FFF; margin-top:10px; padding-top:20px; } div#date p#jour { font-size:16px; margin-left:-5px; font-weight:bold; color: #D1A01D; } div#date p#jourchiffre { font-size:14px; font-weight:bold; } div#date p#mois { font-size:14px; margin-left:-20px; } div#date p#annee{ font-size:14px; } div#date p#heure { font-size:12px; margin:2px; color: #D1A01D; } div#help p#title { font-size:18px; font-weight:bold; margin:2px; color: #D1A01D; } div#last_new p#title { font-size:18px; font-weight:bold; margin:2px; color: #D1A01D; } /* Lien du subheader */ div#header .dynamic_menu h5.links { background:none; border:none; color:#edfff0; width:134px; background:url(images/button.png) no-repeat; padding:5px 0px; font-size:11px; margin-right:1px; } div#header .dynamic_menu h5.links:hover { color:#edfff0; cursor:default; background:url(images/button_click.png) no-repeat; } div#header .dynamic_menu h5 a { color:#FFFFFF; text-decoration:none; } /* ##### Compteur de visites ###### */ div#compteur { color:#E9ECD9; position:absolute; top:63px; right:0; font-size:11px; margin-right:15px; text-align:right; } /* ##### Menu de droite (droite) ###### */ div#left_menu { float:right; width:190px; background:#dfddd6 url(images/bottom_menu.png) repeat-x bottom; border:1px #515151 solid; margin-top:3px; margin-left:10px !important; margin-left:7px; padding-bottom:10px; } /* ##### Menu de droite (gauche) ###### */ div#right_menu { float:right; width:190px; background:#dfddd6 url(images/bottom_menu.png) repeat-x bottom; border:1px #515151 solid; margin-top:3px; margin-left:10px !important; margin-left:7px; padding-bottom:10px; } /* ##### Contenu de la page ###### */ div#main { width:auto; min-width:150px; overflow:hidden !important; height:auto !important; overflow:visible; height:1%; padding:0; margin:0; float:none; } /* ##### Contenu central ###### */ div#main_content { width:auto; min-height:400px; margin-top:4px; padding:20px 10px; padding-top:5px; border-spacing:1px; background:#dfddd6 url(images/bottom_menu.png) repeat-x bottom; border:1px #515151 solid; } /* ##### Barre de lien rapide ###### */ div#links { /*width:96%;*/ text-indent:10px; margin-bottom:20px; } /* ##### Emplacement au dessus de contenu de la page ###### */ div#top_contents { margin-top:8px; margin-bottom:8px; } /* ##### Emplacement en dessous de contenu de la page ###### */ div#bottom_contents { margin-top:8px; margin-bottom:8px; } /* ##### Bloc au dessus du pied de page ###### */ div#top_footer { clear:both; padding:0.75em; } /* ##### Pied de page ###### */ div#footer { height:100px; clear:both; margin:auto; margin-top:0px; padding:0px; padding-top:20px; padding-right:20px; text-align:right; background:#F5F4ED url(images/footer.png) repeat-x; } div#footer span { color:#A28129; font-size:10px; } div#footer span a { color:#F0BB32; font-size:10px; } /* ##### Liens rapides ###### */ div#links_vertical { display:block !important; display:none; position:fixed; background:url(images/vertical_menu_repeat.png) repeat-y; top:45%; margin-left:989px; width:27px; text-align:center; padding-left:2px; } div#links_vertical_top { width:29px; background:url(images/vertical_menu_top.png) no-repeat; text-align:center; margin-left:-2px; padding-top:8px; } div#links_vertical_central { width:27px; text-align:center; margin-left:-2px; padding:4px 0px; } div#links_vertical_bottom { width:29px; background:url(images/vertical_menu_bottom.png) no-repeat; text-align:center; height:32px; margin-left:-2px; } .bglinks { background:url(images/bgmenu_links.jpg) no-repeat bottom right; margin:0px; padding:0px; list-style-type:none; padding-bottom:7px; margin-bottom:5px; }
J'espère que vous vous y retrouverez
Wootbike Membre non connecté
Booster Fronde
-
Booster Fronde
- Voir le profil du membre Wootbike
- Inscrit le : 13/08/2010
ReidLos Membre non connecté
-
Modérateur
- Voir le profil du membre ReidLos
- Inscrit le : 27/02/2009
- Site internet
- Groupes :
-
Equipe Développement
Wootbike Membre non connecté
Booster Fronde
-
Booster Fronde
- Voir le profil du membre Wootbike
- Inscrit le : 13/08/2010
Encore merci
Répondre
Vous n'êtes pas autorisé à écrire dans cette catégorie