Fond au centre + Scrollbar coloré [HTML]

Cheesy. -  
 tpinparis -
Bonjour,
J'essaie de centrer le fond de ma page index mais j'y arrive pas --' J'ai déja essayé ce code :

body
{
background-image:url(fond.gif);
background-repeat:no-repeat;
background-position: center center;
}

mais ça marche pas :/

Quelqu'un pourrait-il m'aider ? Et comment faire pour changer les couleur du scrollbar ? Merci d'avance ^^
Configuration: Windows XP
Internet Explorer 6.0

10 réponses

  1. fabioune
     
    Salut chez moi si je fais comme toi l'image n'est pas centrée, as-tu mis ce code dans la page html ???

    Si oui, il faut le placer entre 2 balises style dans la partie <head>: 

    <style>
body
{
background-image:url(tonimage.gif);
background-repeat:no-repeat;
background-position: center center;
background-attachment: fixed ;essaie de rajouter cette ligne
}
</style>


    Pour la scrollbar, ça n'est reconnu que par IE donc gare ce n'est pas du code valide (après les dièses tu mets les codes de couleur que tu as choisi): 

    <style>

body
{

scrollbar-face-color: "#";
scrollbar-track-color: "#";
scrollbar-arrow-color: "#";
scrollbar-shadow-color: " #";
scrollbar-highlight-color: "#" ;
scrollbar-3dlight-color: "# ";
scrollbar-darkshadow-color: " #";

}

</style>
    0
  2. Cheesy.
     
    Merci pour la réponse mais ça marche pas chez moi, ni pour le fond, ni pour la scrollbar. La scrollbar est restée la même mais le fond a complétement disparu. Je dois faire quoi ? Merci d'avance ^^
    0
  3. Scalpweb Messages postés 1483 Statut Membre 43
     
    Essayes ça :

    background-position: center middle;
    0
  4. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    salut,

    il n'y a pas de middle pour {background-position}.

    le plus simple reste les pourcentages mais de toute façon il faudrait savoir comment <body> est rendu car il faut peut être lui appliquer une taille fixe. 
    body
{
background-image:url(fond.gif);
background-repeat:no-repeat;
background-position: 50% 50%;
}

    as-tu une version en ligne de ta page ?
    0

  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. Scalpweb Messages postés 1483 Statut Membre 43
     
    html, body
    {
    background-image:url(fond.gif);
    background-repeat:no-repeat;
    background-position: 50% 50%;
    height: 100%;
    }

    devrait fonctionner...

    Mais ça risque de te gêner en fonction du reste de ta page...
    0
    1. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
       
      tu doubles l'arrière-plan…
      0
  7. Cheesy.
     
    Le fond n'apparait plus même avc ce code. J'ai un fond blanc à la place de mon fond. Voici le code si ça vous aide : 

    <style type="text/css">
  body {
    color : #000000;  
    font-weight : bold;
    background-image: F:\Something Else/Images/something__layout.gif;
    background-repeat:no-repeat;
    background-position: center center;
    background-attachment: fixed ;
    scrollbar-face-color: "#D5DFE1";
    scrollbar-track-color: "#D5DFE1";
    scrollbar-arrow-color: "#FFFFFF";
    scrollbar-shadow-color: " #197479";
    scrollbar-highlight-color: "#197479" ;
    scrollbar-3dlight-color: "#197479";
    scrollbar-darkshadow-color: "#197479";
    }
  a {
    text-decoration : none;
    color : #000000;
    text-align : left;
    }
  a:hover {
    text-align : right;
    }         
    a:hover { color : #FFFFFF; text-decoration : line-through;} 
    
</style>


    Merci d'avance
    0
    1. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
       
      tu as une erreur : 
      background-image: F:\Something Else/Images/something__layout.gif;

      et il faut une adresse relative : 
      background-image: url(something__layout.gif);
      0
  8. Cheesy.
     
    J'ai essayé avec une adresse relative, ça n'a pas marché. La solution est de mettre le fond dans une balise

    EX: 

    <body background="url de votre fond">


    et de mettre ce code entre les balises 
    <style>
    et 
    </style>


    body {
    color : #000000;  
    font-weight : bold;
    background-image: something__layout.gif;
    background-repeat:no-repeat; 
    background-position: center top; 
    }


    Voilà, le problème du fond est réglé ^^

    Quelqu'un pourrait-il ùm'aider pour la scrollbar ?
    0
    1. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
       
      La solution est de mettre le fond dans une balise
      non, suffit de trouver d'où vient ton erreur.

      et si tu fais les deux à la fois, il a toujours un problème.

      pour les barres de défilement c'est du propriétaire…
      mais si tu y tiens ! regarde ce tuto mais que le début !
      0
  9. fabioune
     
    L'image a sûrement disparu car tu n'as pas remplacé tonimage.gif par fond.gif:
    Voilà le code complet: 

     <style>
body
{
background-image:url(fond.gif);
background-repeat:no-repeat;
background-position: center center;
background-attachment: fixed ;
scrollbar-face-color: "#D5DFE1";
scrollbar-track-color: "#D5DFE1";
scrollbar-arrow-color: "#FFFFFF";
scrollbar-shadow-color: " #197479";
scrollbar-highlight-color: "#197479" ;
scrollbar-3dlight-color: "#197479";
scrollbar-darkshadow-color: "#197479";
}
</style>


    Voili voilà.
    fab.
    0
  10. Cheesy.
     
    Le fond fonctionne à merveille donc je compte pas changer le code :p

    Pour la scrollbar, ça marche toujours pas pourtant j'ai IE --' Y'as pas un autre code à ajouter ? Du HTML ?

    Merci encore à tous ^^
    0
    1. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
       
      Le fond fonctionne à merveille donc je compte pas changer le code
      et tu as bien raison.
      c'était juste pour t'informer que tu fais deux fois la même opération et que donc il y en a une d'inutile.
      0
  11. tpinparis
     
    Ta scrollbar devrait marcher IE (encore que cela dépend de la version que tu as : avec IE7 et IE 8 c'est OK), mais le scrollbar-face-color n'est pas reconnu par le W3C car c'est spécifique à Microsoft donc ça ne marche pas sur les autres navigateurs type Firefox... Mais il est a priori possible de le faire avec du jquery : https://lists.w3.org/Archives/Public/www-validator/2010Feb/0091.html
    0

Discussions similaires

additionner nombres dans cellules avec texte
kawimaki -
kawimaki -

6 réponses
Cellules en surbrillance selon une TextBox
Wyrgle -
jordane45 -

1 réponse
Mise en forme conditionnelle "compris entre"
Htfrison -
Vaucluse -

3 réponses
Fond d'écran carousel xiaomi
Thomasg -
Albator -

3 réponses
Est-ce que je peux aller chercher un colis à l'agence Chronopost
xXJOSSXx -
MPMP10 -

8 réponses