css pour mon header dans prestashop
Bonjour à tous ,
J'ai besoin d'aide : je m'arrache les cheveux (que je n'ai pas d ailleurs) depuis des jours sur le header de mes pages dont j aimerais qu'il ressemble exactement à ça :
http://www.petits-papiers.com/img/header1.gif
Le problème : mon header aujourd'hui il ressemble à ça :
http://www.petits-papiers.com/img/header.gif
Je voudrais donc :
- centrer le logo
- baisser lepanier,
- deplacer les liens et les drapeaux/currencies
- rajouter un texte à droite
Je ne sais pas quoi faire, j'ai essayé de rajouter des div pour les différents blocs mais je patauge...
Voila le header.tpl :
Code:
1 2 3 4 5 6 7 8 9 10 11 12
|
<!-- Header -->
<div id="header">
<div class="page">
<div class="logo"><a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
<img class="logo" src="{$img_ps_dir}logo.jpg?{$img_update_time}" 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>
<div id="header_right">
{$HOOK_TOP}
</div>
</div>
</div> |
et le global.css :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30
| /* global layout #bab8b1 */
#header {
background: url('../img/header2.gif') no-repeat center ;
height: 150px;
margin-bottom: 20px
}
.page {
width: 900px;
margin: 0 auto;
text-align: left
}
#header_logo {
float: left;
width: 264px;
display:block
}
img.logo {
float: left;
font-size: 2em;
font-weight: bold
}
#header_right {
float: left;
margin-bottom: 15px;
text-align: right;
padding-left: 15px;
width: 610px;
} |
Merci à tous. :)