Comment Faire Pour Avoir De La Marge Pour L'Image De Fond?

Voici la structure du code de mon site web.

<body class="xxx">
    <div id="top-header">... code ...</div>
    <div id="wrapper">... code ...</div>
</body>

Et c'est le code CSS que j'utilise pour une image d'arrière-plan.

body {
    background-image: url('http://example.com/background-image.jpg');
    background-position: top right;
    background-repeat: repeat;
}

Le problème que j'ai avec c'est, à propos de 50px de l'image de fond est caché sous le "top-header" div, qui est 50px en hauteur (C'est le menu). Comment puis-je modifier le code pour que l'image d'arrière-plan affiche correctement, complètement en dessous du menu (en haut de l'en-tête)?

Seulement si, vous savez, j'ai essayé ce code css:

#wrapper {
    background-image: url('http://example.com/background-image.jpg');
    background-position: top right;
    background-repeat: repeat;
}

Et cela a changé le fond blanc de mon contenu de l'image. Ce qui n'est pas ce que je veux.

Le seul moyen est de déplacer le point de départ de background-image 50px vers le bas. Comment le définir? Veuillez essayer de l'aider. Merci.

Je n'ai pas. Les autres ont fait. Je n'ai pas réalisé mon erreur jusqu'à ce que j'ai trouvé que ce sujet a été fermé. Je ne sais vraiment pas comment j'ai atterri ici, quand je suis connecté sur stackoverflow 🙁
J'aime quand les gens à résoudre leurs propres problèmes. Si votre pseudo semble incorrect :-). Bonne chance et à bientôt.
merci pour les paroles!

OriginalL'auteur its_me | 2011-10-16

  1. 3

    Désolé les gars, c'était facile. J'ai effectivement suivi le CSS Twitter utilise pour le fond, et je l'ai eu. J'ai juste eu à remplacer "en haut à droite" avec "droit 50px" où 50px est égal à la marge que vous souhaitez laisser en haut de l'image d'arrière-plan.

    body {
    background-image: url('http://example.com/background-image.jpg');
    background-position: right 50px;
    background-repeat: repeat;
}

    cheers!

    OriginalL'auteur

  2. 0

    d'utiliser ce style:

    background-position: calc(100% - 30px) center;

    exemple: 

    body {
    background-image: url('http://example.com/background-image.jpg');
    background-position: calc(100% - 30px) center;
    background-repeat: repeat;
}

    au lieu de 30px vous pouvez modifier la valeur de pixel pour le positionnement de l'image d'arrière-plan.

    OriginalL'auteur Dayz