28172 sujets

CSS et mise en forme, CSS3

Bonjour, je suis en train de m'arracher les cheveux sur un problème de positionnement du logo de mon site (www.aura-paysage.fr)

J'ai créé une div "global" à laquelle j'ai mis un background. Cette div contient les div "logo" et "menu".
Sur ma page d'accueil, mon logo se trouve à une distance de mon entête que je voudrais réduire sur les pages suivantes (présentation, portfolio, services et contact).
Le problème que je rencontre est que je voudrais encore monter mon logo sur les pages présentations, portfolio... et que je n'y arrive plus à cause d'une marge que j'ai appliqué à ma DIV global, cette marge me permettant notamment de positionner mon background.

Depuis hier je cherche à modifier mes marges et mes paddings mais sans résultat concluant :
- soit je supprime la marge de ma div global et à ce moment là tout remonte y compris mon background alors que je voudrais qu'il reste à cette place ;
- soit je conserve cette marge et, à ce moment là, je suis limité pour remonter mon logo.

Auriez-vous une méthode qui me permettrait d'obtenir le résultat souhaité sans affecter la position de mon background ?

Merci
Modifié par Zephyr06 (05 Jan 2014 - 16:50)
Bonjour,

Pourquoi ne pas affecter cette image d'arrière plan à la balise body ?
D'une manière générale, tu te compliques la vie, en fixant des dimensions (en hauteur notamment), en tentant de positionner via des marges externes ou internes.
Par exemple pour ton logo, un simple "text-align:center;" sur body devrait suffire à le positionner comme tu le souhaites (penser à rétablir l'alignement à gauche sur #contenu), penses également à mettre les dimensions des images dans le code HTML).

Ensuite, tu descends dans l'arborescence de ton document et tu corriges ce qui doit l'être.

Petit guide de survie du positionnement CSS (à lire absolument !)

D'autres mode de rendu :
Display inline-block, une valeur trop peu utilisée (ça peut être pas mal pour tes blocks de présentation)
Mise en page CSS avancée grâce à la propriété display

Pour anticiper certains problèmes :
Gérer les débordements de contenus grâce à CSS

La section Apprendre regorge d'informations utiles Smiley cligne

Fais des essais, et reviens nous voir Smiley cligne
Je veux pas dire de bêtise mais, en mettant mon image sur body, si je veux la placer où je le souhaite je serait quand-même contraint d'utiliser des marges ou du padding, non ?

De plus mon logo est une image... je doute que text-align puisse agir dessus...
Modifié par Zephyr06 (05 Jan 2014 - 11:14)
Zephyr06 a écrit :
Je veux pas dire de bêtise mais, en mettant mon image sur body, si je veux la placer où je le souhaite je serait quand-même contraint d'utiliser des marges ou du padding, non ?
Fais des essais...
Zephyr06 a écrit :
De plus mon logo est une image... je doute que text-align puisse agir dessus...
Homme de peu de foi... Smiley cligne
Lol ^^
Bon finalement j'ai suivi ton conseil, j'ai intégré mon arrière plan au body...
Je l'ai retravaillé sous photoshop pour modifier sa taille et ça tombe nickel.
Reste à tout réordonner Smiley biggrin
Patience est mère des vertus ^^
Merci pour tout, à très bientôt, je pense qu'on se reparlera d'ici peu Smiley langue