Bonjour,
Voila, j'ai fait une maquette en local du site de ma boite et tout fonctionne correctement avec IE6,7 et firefox3... Pour le site, j'ai créé 4 fichiers css que j'inclus comme tout le monde dans le head html.
Seulement, une fois sur le serveur de pré-prod, tout marche différemment, j'ai du changer pas mal de propriétés css pour avoir ce que j'avais sur ma maquette pour la page d'accueil par exemple. Pour le reste, je n'arrive toujours pas a trouver des solutions mais je pense que tout est liés a un problème d'héritage.
Je me suis rendu compte qu'avec tout les problèmes que j'avais, design général, menu déroulant pure css, page d'accueil, popup css etc. qu'il n'avait pas les propriétés déclaré dans mon css avec firebug. Pour faire simple et cours je prends l'exemple de mes popups :
Je travail avec le couple php-smarty.
Problème: Mon image dans un <a> et un <p> qui représente une petite croix ne veux pas s'aligner en haut a droite de mon popup. De même j'ai une marge au dessus alors qu'il ne devrait pas y en avoir...
Une partie de popup.css :
une partie de model.tpl:
Une partie de design.css :
Bien sûr comme vous pouvez vous en douter, le popup qui est un div de classe "popup" est contenu dans le div d'id "index".
Et la avec firebug, je me rend compte que mon text-align est justify et que jai un margin top et bottom de 10px sur IE et Firefox. Nous savons maintenant que le navigateur prend en compte en priorités les propriété déclaré dans design.css au lieu de popup.css.
{UPDATE}
Jai réussi a mettre les margin à 0px en mettant dans popup.css :
.popup_top p a {
text-align: right;
padding: 0px;
margin: 0px;
}
Seulement je n'arrive toujours pas a aligner la croix a droite...
{/UPDATE}
Modifié par bidaleon (06 Jan 2009 - 16:05)
Voila, j'ai fait une maquette en local du site de ma boite et tout fonctionne correctement avec IE6,7 et firefox3... Pour le site, j'ai créé 4 fichiers css que j'inclus comme tout le monde dans le head html.
Seulement, une fois sur le serveur de pré-prod, tout marche différemment, j'ai du changer pas mal de propriétés css pour avoir ce que j'avais sur ma maquette pour la page d'accueil par exemple. Pour le reste, je n'arrive toujours pas a trouver des solutions mais je pense que tout est liés a un problème d'héritage.
Je me suis rendu compte qu'avec tout les problèmes que j'avais, design général, menu déroulant pure css, page d'accueil, popup css etc. qu'il n'avait pas les propriétés déclaré dans mon css avec firebug. Pour faire simple et cours je prends l'exemple de mes popups :
Je travail avec le couple php-smarty.
Problème: Mon image dans un <a> et un <p> qui représente une petite croix ne veux pas s'aligner en haut a droite de mon popup. De même j'ai une marge au dessus alors qu'il ne devrait pas y en avoir...
Une partie de popup.css :
.popup_top{
width:100%;
height: 23px;
z-index: 1002;
padding: 0px;
margin: 0px;
}
.popup_top p, .popup_top a{
text-align: right;
padding: 0px;
margin: 0px;
}
une partie de model.tpl:
<div id="{$model.id}" class="popup" style="display:none;">
<div class="popup_top">
<p><a href="#" onclick="hide_popup({$model.id})"><img src="/img/button-close-focus.gif" alt="Close" title="Click to close"/></a></p>
</div>
<div class="popup_content">
etc etc etc
</div>
</div>
Une partie de design.css :
#index p { text-align: justify; margin: 10px 0px 10px 0px ; font-size: 12px;}
Bien sûr comme vous pouvez vous en douter, le popup qui est un div de classe "popup" est contenu dans le div d'id "index".
Et la avec firebug, je me rend compte que mon text-align est justify et que jai un margin top et bottom de 10px sur IE et Firefox. Nous savons maintenant que le navigateur prend en compte en priorités les propriété déclaré dans design.css au lieu de popup.css.
{UPDATE}
Jai réussi a mettre les margin à 0px en mettant dans popup.css :
.popup_top p a {
text-align: right;
padding: 0px;
margin: 0px;
}
Seulement je n'arrive toujours pas a aligner la croix a droite...
{/UPDATE}
Modifié par bidaleon (06 Jan 2009 - 16:05)
