Bonjours chers amis codeur,

Voila je travaille actuellement sur le codage d'un forum.
Le soucis j'ai crée un header de fond :

https://i.imgur.com/s8bTCQx.png

Comme vous pouvez le constastez il y a sur cette image quelque partie qui suggere qu'il doit y avoir quelques choses...
So,  J'essaye de trouver un moyen d'introduire dessus une Iframe je suppose pour afficher le lecteur Audio
en dessous pouvoir afficher la navigation et ajouter les acces au reseaux sociaux a droite


J'ai cherché un peu, et les tutos sur les images réactives m'ont parlé, mais je suis totalement perdu sur l'utilisation des codes T_T

Je n'ai pas toucher au Overhall-header pour l'instant et l'image de fond est codé dans la parti body du css....

Pouvez vous m'aider avant que j'en mange mes cheveux xDDD
S'il vous plais :3

Il faut que tu enlèves ces éléments en plus de l'image : en effet tu vas les coder à part puis les positionner en CSS, s'il y a déjà dans l'image de fond des images, cela va perdre les gens.

Ajoute tout au début du code de ta PA ce code HTML :

Code:

<div class="social" id="twitter">
 <a href="LIEN_VERS_TWITTER" title="Découvrez notre twitter !">
 <img src="LIEN_IMAGE_TWITTER" alt="Twitter"/>
 </a>
</div>

Le CSS à rajouter

Code:

/* Pour chaque boutons vers un réseau social en haut*/
.social {
    position: fixed;
    top: 0;
    z-index: 5;
}

#twitter {
    right: 150px; /* positionnement depuis le bord droit */
}

C'est le code pour un bouton. Dis moi déjà si cela fonctionne

Oooooh c'est magique ! :3
Oui ton code marche très bien :3

http://theseventhworsen.forumactif.org/

Je te laisse verifier par toi même ^^' J'ai fait que le Tumblr pour l'instant ^^

Arf j'ai un soucis...
Je viens de remarquer que que les onglet descender tous, mais du coup ca ne m'interesse pas...

Pas de problèmes

Dans .social, remplace le "fixed" par "absolute", cela devrait être bon

Code:

 .social{
    position: absolute;
    top: 0;
    z-index: 5;
}

Au fait j'ai vu que pour beaucoup des liens avec la class "social", tu as rajouté "top: 25px". Tu peux l'enlever des id (#twitter, etc) et plutôt le mettre sur le ".social", comme ceci :

Code:

 .social{
    position: absolute;
    top: 25px;
    z-index: 5;
}

Oooh merci beaucoup.

Maintenant il me reste le soucis de la navigation

Donc je t'explique
Si je suis le procédé que tu viens de me montre il faudrais simplement que je fasse une div inserer un cadre, mais le soucis j'aimerais que ma navigation soit latéral

Qu'entends tu par "latérale" ? Tu veux qu'entre chaque lien il y a ai un retour à la ligne c'est ça ?
Si oui, la première étape à faire est d'aller dans le template "overall_header" et mettre une div autour de ce qui génère la barre de navigation.
Exemple :

Code:

<div class="ma-navbar">{GENERATED_NAV_BAR}

Et ensuite dans le CSS, quelque chose dans ce genre :

Code:

.ma-navbar a.mainmenu{
    display: block;
}

Citation :

Il faut que tu enlèves ces éléments en plus de l'image : en effet tu vas les coder à part puis les positionner en CSS, s'il y a déjà dans l'image de fond des images, cela va perdre les gens.

Pense à enlever les images de l'image de fond, sinon peut donner quelque chose comme ça sur un écran avec une taille différente du tiens : https://i.imgur.com/NwvCC4n.png

Ah oui merci effectivement c'etait ce que je recherchais ^^

Pour les images de fond j'ai paumer le Psd de mon header T_T du coup j'en refais, mais je te remercie beaucoup pour ton aide tu m'enleves une sacré épines du pied =3