Positionnement du module panier

[Darwayne]

Bonjour à la communauté Prestashop.

 

Je suis débutant sur Prestashop, également en code, particulièrement en php. J'étais en train de personnaliser mon thème en css, notament le header, depuis css global. Seulement voilà, un gros problème de positionnement css survient lorsque que je teste mon site sur firefox.

 

Les blocs recherche et panier étaient complètement décalés. (ils sont centrés dans le header sur firefox, alors qu'ils sont bien placé à droite sur chrome). J'ai réussi à remettre le block recherche à sa place en virant une position absolute et en le décalant manuellement, mais pour le bloc panier, rien à faire.

 

Tout ce dont j'ai besoin, c'est de replacer le bloc panier à droite, dans le header, bref sa position initiale quoi. D'abord, j'ai tenté de décaller le bloc panier dans blockcart.css mais il ne se passe rien. Ensuite, j'ai parcouru de nombreux topics traitant du positionnement du module panier (au niveau du greffage du block à la colomne de droite). Déjà que je galère en php, j'ai beau tenter de greffer le module, il ne se passe rien. J'ai passé beaucoup de temps header.tpl et footer.tpl mais encore une fois, rien ne se passe.

 

Et surtout, ce que je souhaite étant finalement assez simple (remettre le bloc panier à droite), je voulais savoir si ce n'était pas possible de tenter quelques chose dans le global.css ou blockcart.css pour changer la donne.

 

Je vous laisse tous les codes que j'ai modifié, suceptibles de vous intéresser pour m'aider.

D'abord dans le global css :

 

#header {
		    position:relative;
   background: transparent url('../img/header.jpg') no-repeat top left;
   color:#FFFFFF;
	   }

#header {position:relative; background-color:#000000)(}
#header_logo {
display:block;
margin-top:30px;
}
#header_right {
position:relative;

}

 

En fait, pour le header, j'ai mis une image en fond et j'ai enlevé le logo dans le header.tpl (mis en commentaire)

 

{/if}
 <div id="page" class="container_9 clearfix">
  <!-- Header -->
  <div id="header" class="grid_9 alpha omega">
   {*<a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">*}
 {*<img class="logo" src="{$logo_url}" alt="{$shop_name|escape:'htmlall':'UTF-8'}" {if $logo_image_width}width="{$logo_image_width}"{/if} {if $logo_image_height}height="{$logo_image_height}" {/if} />*}
   {*</a>*}
   <div id="header_right" class="grid_6 omega">
 {$HOOK_TOP}
   </div>

  </div>
  <div id="columns" class="grid_9 alpha omega clearfix">
   <!-- Left -->
   <div id="left_column" class="column grid_2 alpha">
 {$HOOK_LEFT_COLUMN}
   </div>
   <!-- Center -->
   <div id="center_column" class=" grid_5">
{/if}

 

Enfin, le code du blockcart.css:

 

#left_column #cart_block, #right_column #cart_block {
}
#header  #cart_block .title_block, #header  #cart_block h4 {
display: none;
}
#header #cart_block {
z-index: 10;
display:none;
position: absolute;
right: 0;
top: 65px;
height: auto;
width: 200px;
-moz-border-bottom-right-radius: 3px;
-moz-border-bottom-left-radius: 3px;
-webkit-border-bottom-right-radius: 3px;
-webkit-border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
box-shadow: 0 1px 0 #C6C6C6;
background:#eee
}
#cart_block.cart_block_hover {display:block}
#cart_block .title_block  span, #header  #cart_block h4 {
float: right;
padding-left: 10px;
text-transform: none;
background-position: left top;
background-repeat: no-repeat;
cursor: pointer
}

 

Est-ce quelqu'un pourrait m'expliquer clairement ce que je dois changer pour remettre le bloc panier à sa place ?

Si la méthode de greffer le module panier à la colomne droite est indispensable, est-ce que quelqu'un peut m'expliquer la méthode de manière la plus simple possible car je comprend vraiment rien sur les autres forums >_<

 

En esperant que quelqu'un aura la patience de répondre à cette requête.

Désolé d'avance pour mon niveau très limité ^^'