Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > CSS
CSS Forum d'entraide sur l'utilisation des feuilles de style CSS. Avant de poster : Cours CSS, FAQ CSS, Galerie CSS
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 24/01/2012, 11h36   #1
Invité de passage
 
Homme
Inscription : janvier 2012
Messages : 1
Détails du profil
Informations personnelles :
Sexe : Homme

Informations forums :
Inscription : janvier 2012
Messages : 1
Points : 0
Points : 0
Par défaut 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 :



Le problème : mon header aujourd'hui il ressemble à ça :






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 html :
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.
galhal est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 25/01/2012, 09h30   #2
Membre actif
 
Avatar de Emyleen
 
Femme Emeline Dabée
Webmaster
Inscription : mars 2010
Messages : 136
Détails du profil
Informations personnelles :
Nom : Femme Emeline Dabée
Âge : 26
Localisation : France, Aveyron (Midi Pyrénées)

Informations professionnelles :
Activité : Webmaster
Secteur : High Tech - Éditeur de logiciels

Informations forums :
Inscription : mars 2010
Messages : 136
Points : 171
Points : 171
Bonjour!

Voila un exemple d'organisation, essaye de le modifier à ta sauce et dis moi si ça fonctionne

Code css :
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
31
* {
	position: relative;
	margin: 0;
	padding: 0;
}
#page {
	width: 900px;
	margin: 0 auto;
	text-align: left
}
#header {
	background: url('../img/header2.gif') no-repeat center ;
	height: 150px;
	margin-bottom: 20px
}
#barreHaut {
	height: 25px;
	width: 900px;
}
#menu,
#logo,
#panier {
	float: left;
	width: 300px;
}
#menu {
}
#logo {
}
#panier{
}

Code html :
1
2
3
4
5
6
7
8
<div id="page">
        <div id="header">
            <div id="barreHaut"></div>
            <div id="menu"></div>
            <div id="logo"></div>
            <div id="panier"></div>
        </div>
    </div>
__________________
I want to break frite ~~ Chocolat....chocolat...CHOCOLAAAAAAAAAAT!!!
Emyleen est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 20h26.


 
 
 
 
Partenaires

Hébergement Web