[CSS] Image de fond se repetant (repeat-y)

Image de fond se repetant (repeat-y) [CSS] - HTML/CSS - Programmation

Marsh Posté le 11-04-2007 à 12:53:45    

Bonjour,  
 
Je viens de terminer le graphisme de mon nouveau "blog" et tout se passe bien mis à part le fait que je n'arrive pas à faire répeter une image de fond sur la longueur...
 
Enfin, c'est assez flou mais vous pouvez remarquer la : http://jery8.free.fr/blog/index5.php qu'i y a un gros rectangle vide (blanc) en bas à gauche... Hors il devrait y avoir ceci :  
 

Code :
  1. #fondmenu
  2. {
  3.    background-image: url("images/fondnoirvide.png" );
  4.    background-repeat: repeat-y;
  5.    background-color: #000000;
  6.    float: right;
  7.    width: 271;
  8. }


 
Je ne vois pas comment faire...  
 
Merci d'avance pour vos réponses!  :)

Reply

Marsh Posté le 11-04-2007 à 12:53:45   

Reply

Marsh Posté le 11-04-2007 à 14:11:15    

La ligne background-image est contredite par la ligne background-color. Je ne crois pas que l'on puisse avoir les deux.
Par ailleurs, les versions anciennes d'Internet Explorer n'affichent pas bien certains fichiers .png. Il vaut mieux avoir des jpg ou des gif.

Reply

Marsh Posté le 11-04-2007 à 14:19:19    

J'ai rajouté la ligne background-color par après pour voir si cela fonctionnait mais sans celle-ci, ca ne va quand même pas...
Quant au choix du png, c'est un choix, simplement :-)
 
Si je remarque des problèmes, j'envisagerais de changer.
 
Merci pour ta réponse!

Reply

Marsh Posté le 11-04-2007 à 14:48:35    

background-color et background-image sont parfaitement compatibles.
la couleur sera affichée jusqu'à ce que l'image soit chargée. c'est un moyen "sexy" d'afficher une page utilisant un background-image lourd, tout en la gardant lisible durant le chargement (par exemple, si on écrit en blanc, et que l'image de fond est dans des tons foncés, on pourra utiliser un background-color noir en attendant).
 
pour le PNG, seul le PNG 32 (c'est à dire le PNG 24 + 8 bits de transparence) est mal supporté sur les anciennes versions de IE. Depuis IE4, IE sait parfaitement afficher les PNG-8 et les PNG-24.

Reply

Marsh Posté le 11-04-2007 à 14:58:22    

Meric pour ta réponse mais tu ne sais pas pourquoi mon image ne s'affiche pas?
Ca me rend fou, je suis certain que c'est une connerie  :pt1cable:

Reply

Marsh Posté le 11-04-2007 à 15:02:37    

Dans le code de ta page
 

Code :
  1. <font face="verdana" size="2">


[:vomi]
 
Et si y'avait que ça... C'est bien de vouloir se mettre au CSS et de se forcer à coder proprement, mais faut aller jusqu'au bout :)
 
Pour ton problème, ton div "fondmenu" n'a aucune hauteur.

Reply

Marsh Posté le 11-04-2007 à 15:08:47    

Jericho a écrit :

Meric pour ta réponse mais tu ne sais pas pourquoi mon image ne s'affiche pas?
Ca me rend fou, je suis certain que c'est une connerie  :pt1cable:


pour moi, c'est un problème avec ton div.
c'est pas le bout d'image qui se balade tout seul tout en bas à droite de la page ?

Reply

Marsh Posté le 11-04-2007 à 15:11:40    

MagicBuzz a écrit :

pour moi, c'est un problème avec ton div.
c'est pas le bout d'image qui se balade tout seul tout en bas à droite de la page ?


 
Non ce bout là, il est correctement placé  :D  
Il faut que l'image du haut se "relie" à cette image la grâce à l'image fondnoirvide.png qui se repete... Mais elle n'affiche et ne se repete pas :/

Reply

Marsh Posté le 11-04-2007 à 15:13:09    

Ayuget a écrit :

Dans le code de ta page
 

Code :
  1. <font face="verdana" size="2">


[:vomi]
 
Et si y'avait que ça... C'est bien de vouloir se mettre au CSS et de se forcer à coder proprement, mais faut aller jusqu'au bout :)
 
Pour ton problème, ton div "fondmenu" n'a aucune hauteur.


 
Je fais de mon mieux, en fait, c'est mon petit frère qui code... Moi, j'étudie pour l'instant, je n'ai pas le temps et je n'ai aucune notion de CSS (je me sens con la, je viens d'avouer que mon petit frère de 16 ans faisait le code d'un gars qui en a 22 et qui étudie l'informatique...). Mais si tu me dis comment écrire ca proprement, je me ferais une joie de lui faire passer le message.
 
Encore une fois, merci pour vos réponses!

Reply

Marsh Posté le 11-04-2007 à 15:17:33    

Y'a toute la page a refaire, et j'ai pas le temps :O
 
Pour ton problème, je t'ai dit dans mon premier post que c'est normal que tu ne vois pas ton fond, car ton div n'a aucune hauteur.

Reply

Marsh Posté le 11-04-2007 à 15:17:33   

Reply

Marsh Posté le 11-04-2007 à 15:20:55    

Ayuget a écrit :

Y'a toute la page a refaire, et j'ai pas le temps :O
 
Pour ton problème, je t'ai dit dans mon premier post que c'est normal que tu ne vois pas ton fond, car ton div n'a aucune hauteur.


 
Je ne t'ai pas demandé de refaire toute la page...  
Je voulais juste te faire remarquer que quand tu pointes une erreur, il est assez sympathique, généralement, de guider vers la solution.
 
Je vais essayer de m'occuper de la hauter de ce div, je vous tiens au courant.
 
Edit : comment savoir quelle hauteur spécifier si cette hauteur n'est pas fixe? Je dois juste spécifier la taille de l'image qui se répetera?


Message édité par Jericho le 11-04-2007 à 15:23:29
Reply

Marsh Posté le 11-04-2007 à 15:37:14    

J'ai fait ceci :  
 

Code :
  1. #fondmenu
  2. {
  3.    background-image: url("images/fondnoirvide.png" );
  4.    background-repeat: repeat-y;
  5.    background-color: #000000;
  6.    float: right;
  7.    width: 271;
  8.    height: 50;
  9. }


 
Ce qui m'avance donc un petit peu mais, elle ne se répete toujours pas, elle n'affiche que 50pixels...  
Comment pourrais-je faire pour qu'elle prenne la place de l'espace blanc automatiquement?

Reply

Marsh Posté le 11-04-2007 à 16:19:05    

J'ai essayé avec ceci :  
 

Code :
  1. #info
  2. {
  3.    background-image: url("images/fondnoirvide.png" );
  4.    background-repeat: repeat-y;
  5.    background-color: #000000;
  6.    float: right;
  7.    width: 271;
  8.    height: 100%;
  9. }


 
Ca avance mais ca ne prend toujours pas la taille que je souhaite...

Reply

Marsh Posté le 12-04-2007 à 09:39:42    

lu,
tien voilà un css deja plus propre
 

Code :
  1. #info
  2. {
  3.    background: black url("images/fondnoirvide.png" ) repeat-y;
  4.    float: right;
  5.    width: 271px;
  6.    height: 100%
  7. }


Message édité par eduardo_35 le 12-04-2007 à 18:16:27
Reply

Marsh Posté le 12-04-2007 à 09:53:02    

#000000 c'est "black", pas "white" :p

Reply

Marsh Posté le 12-04-2007 à 18:16:17    

ous oui lol vais editer sur ma belle betise XD merci je l'avoir vue :)

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed