header qui prend toute la largeur de l'écran

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu header qui prend toute la largeur de l'écran

Message par Hope_Hell Jeu 23 Nov 2017 - 17:28

Bonjour à toute la Communauté, (je relance mon message)

mon problème est très simple : après avoir lu pas mal de sujets postés, je n'ai toujours pas trouvé de solution.
Je voudrais placer une bannière/Header eu dessous de ma barre de navigation et qui prenne toute la largeur de l'écran sans déformer/Agrandir le corps de mon forum, ni bien sûr déformer ma barre de navigation.
Avez-vous une astuce à me donner ?

Un grand merci par avance pour votre aide flower


Dernière édition par Hope_Hell le Ven 24 Nov 2017 - 21:02, édité 1 fois
Hope_Hell

Hope_Hell
***

Messages : 106
Inscrit(e) le : 21/06/2013

http://asaria.forumpro.fr/
Hope_Hell a été remercié(e) par l'auteur de ce sujet.

Résolu Re: header qui prend toute la largeur de l'écran

Message par Invité Jeu 23 Nov 2017 - 18:25

Hello Hope_Hell,

Dans le template overall_header:
Affichage/Templates/Général/ overall_header

Recherches cette ligne (268 environ):

Code:

<table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
                    <tr>
                        <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
                    </tr>
                </table>

Juste après déposes ceci:

Code:

<div class="M14_banniere"><img src="LE LIEN DE L IMAGE"/></div>

Remplaces " LE LIEN DE L IMAGE" par l'image que tu souhaites.


Penses à enregistrer puis à valider en cliquant respectivement sur :enreg: puis header qui prend toute la largeur de l'écran 824052533

Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Ajoutes ceci:

Code:

.M14_banniere
{
position: absolute;
margin-top: 20px;/*on decale de 20 px de la barre de navigation*/
width: 100%;
left: 0px;
right: 0px;
background: black; /*couleur de fond*/
text-align:center;/*on centre l image*/
}

/* on decale de la meme hauteur que l image*/
#page-body{margin-top: xxx px;}






Ici:
Code:

/* on decale de la meme hauteur que l image*/
#page-body{margin-top: xxx px;}

Penses à cliquer sur le bouton header qui prend toute la largeur de l'écran 3060548200

Remplaces xxx px par la hauteur de l'image .
Si l'image à une hauteur de 200px
Le style sera alors:
Code:
#page-body{margin-top: 200px;}


a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: header qui prend toute la largeur de l'écran

Message par Hope_Hell Ven 24 Nov 2017 - 21:01

Merci beaucoup pour votre aide ♥️
Hope_Hell

Hope_Hell
***

Messages : 106
Inscrit(e) le : 21/06/2013

http://asaria.forumpro.fr/
Hope_Hell a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum