Problème alignement oscommerce
Résolu
faboons
Messages postés
275
Date d'inscription
Statut
Membre
Dernière intervention
-
faboons Messages postés 275 Date d'inscription Statut Membre Dernière intervention -
faboons Messages postés 275 Date d'inscription Statut Membre Dernière intervention -
Bonsoir,
je tente de créer un rollover css dans le fichier header.php d'oscommerce.
Pour cela, j'ai ce code :
Et dans le css :
Mon problème est que mes icônes sont bien alignées sur un écran 17'' mais quand je change d'écran ils se décalent.
Je sais q'une partie du problème vient du positionnement en absolute mais quelqu'un connaît-il un autre moyen de faire ce roll-over ? En effet, si je ne positione rien l'image en background dans le css est décalée vers le bas.
Cordialement.
Fab.
je tente de créer un rollover css dans le fichier header.php d'oscommerce.
Pour cela, j'ai ce code :
<table border="0" summary="" width="100%" cellspacing="0" cellpadding="0">
<tr class="header">
<td align="right" valign="bottom"><?php echo '<a href="' . tep_href_link(FILENAME_ACCOUNT, '', 'SSL') . '" class="header1" style="position:absolute; z-index:1; right:260px; bottom:385px;" >' . tep_image(DIR_WS_IMAGES . 'header_account.png',HEADER_TITLE_MY_ACCOUNT) . '</a><a href="' . tep_href_link(FILENAME_SHOPPING_CART) . '" class="header2" style="position:absolute; z-index:2; right:160px; bottom:383px;" >' . tep_image(DIR_WS_IMAGES . 'header_cart.png', HEADER_TITLE_CART_CONTENTS) . '</a> <a href="' . tep_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL') . '" class="header3" style="position:absolute; right:80px; bottom:387px;">' . tep_image(DIR_WS_IMAGES . 'commande.png', HEADER_TITLE_CHECKOUT) . '</a>'; ?><br /></td>
</tr>
</table>
Et dans le css :
a.header1 {background-image: url('images/header_account2.png'); background-repeat:no-repeat; }
a.header1:hover { visibility: visible; }
a.header1:hover img { visibility: hidden; }
a.header2 {background-image: url('images/header_cart2.png'); background-repeat:no-repeat; }
a.header2:hover { visibility: visible; }
a.header2:hover img { visibility: hidden; }
a.header3 {background-image: url('images/commande2.png'); background-repeat:no-repeat; }
a.header3:hover { visibility: visible; }
a.header3:hover img { visibility: hidden; }
Mon problème est que mes icônes sont bien alignées sur un écran 17'' mais quand je change d'écran ils se décalent.
Je sais q'une partie du problème vient du positionnement en absolute mais quelqu'un connaît-il un autre moyen de faire ce roll-over ? En effet, si je ne positione rien l'image en background dans le css est décalée vers le bas.
Cordialement.
Fab.
