[CSS]Repetition d'un motif

Résolu/Fermé
Signaler
Messages postés
109
Date d'inscription
mercredi 6 janvier 2010
Statut
Membre
Dernière intervention
11 avril 2013
-
Messages postés
109
Date d'inscription
mercredi 6 janvier 2010
Statut
Membre
Dernière intervention
11 avril 2013
-
Bonsoir,

J'aimerais disposer sur le background des billets d'un blog un fond rayé, avec une ombre interne.
Seulement les rayures ne correspondent pas... je pense que cela vient de la répétition du fond du milieu, l'image se répète mais pas forcément entièrement : elle s'arrête dès que l'on arrive à la fin du texte.
Comment l'obliger à se répéter jusqu'à sa propre fin (et si le texte est fini ?)

Je vous mets une image pour mieux situer mon problème :
https://www.imagup.com/data-recovery-solutions-for-small-businesses-of-san-francisco/


Et mon code :

CSS :
.news 
{ 
 margin-top: 10px; 
 padding: 10px; 
} 

.news_tete 
{ 
 height: 20px; 
 width: 570px; 
 background-image: url("img/newstete.png"); 
} 

.news_corps 
{ 
 width: 570px; 
 background-image: url("img/newscorps.png"); 
 background-repeat: y-repeat; 
} 

.news_pied 
{ 
 height: 20px; 
 width: 570px; 
 background-image: url("img/newspied.png"); 
}


HTML :
<div class="news"> 
 <div class="news_tete"></div> 
 <div class="news_corps"> 
   <p><strong><?php echo htmlspecialchars($donnees['titre']); ?></strong></p> 
   <p><strong>Le <?php echo htmlspecialchars($donnees['date']); ?></strong></p> 
   <p><span class="espace"></span><?php echo nl2br(htmlspecialchars($donnees['news'])); ?></p> 
 </div> 
 <div class="news_pied"></div> 
</div>



L'image newscorps.png fait 20px de haut, elle se répète infiniment sans décalage !

Voilà, j'espère qu'avec ça vous avez tout ce qu'il vous faut pour pouvoir m'aider :)
Merci !


3 réponses

Messages postés
352
Date d'inscription
dimanche 30 mai 2010
Statut
Membre
Dernière intervention
6 mars 2014
73
le pb vient de l'image
essaye ici :
http://www.stripegenerator.com/
Messages postés
109
Date d'inscription
mercredi 6 janvier 2010
Statut
Membre
Dernière intervention
11 avril 2013
6
De l'image ? Mon motif se répète pourtant à l'infini sans aucun décalage !
C'est un motif de 10x10 rempli de beige avec une diagonale de 1px dans les tons gris-marrons.
Messages postés
109
Date d'inscription
mercredi 6 janvier 2010
Statut
Membre
Dernière intervention
11 avril 2013
6
Ah j'ai trouvé comment faire ça.
Je vais simplement utiliser de l'ombre (sur fond transparent) pour la tête et le pied.
De cette manière j'aurais plus qu'à répéter un motif sans me soucier des ombres (ou presque) !

Merci duweb :p