28173 sujets

CSS et mise en forme, CSS3

Bonjour,

Est-il possible de mettre 2 images de fond sur un blockquote ?

Par exemple des guillemets ouvrants en haut à gauche et des guillemets fermants en bas à droite.
Modifié par olivier-m (07 Mar 2006 - 16:12)
Hélas non, les éléments n'ont qu'une seule image de fond.
Pour en rajouter une deuxième, il faut un autre élément.

<blockquote>
	<p class="premier">Début de la citation...</p>
	<p class="auteur">Auteur de la citation</p>
</blockquote>


Le deuxième paragraphe n'est pas nécessaire, c'est juste qu'on se sert souvent de quelque chose du genre pour indiquer la source de la citation, l'attribut cite n'étant pas exploité par les navigateurs (ou alors, on se fait un script javascript qui va récupérer l'attribut cite des blockquotes, et créer le paragraphe automatiquement, mais c'est un peu lourd quand même...).

Ah oui, j'oubliais :
blockquote {
	background: url(citationfin.png) no-repeat right bottom;
}
blockquote p {padding-left: 20px; padding-right: 20px;}
blockquote p.premier {background: url(citationdebut.png) no-repeat left top;}
Sinon j'ai aussi vu un tutoriel qui utilisait les pseudo-classes :before et :after, mais :
1/ ça ne passe pas sur IE (mais bon, dégradation gracieuse, tout ça) ;
2/ le CSS associé me semblait un peu casse-gueule quand même.
Merci.

Pour ta solution 1 (des paragraphes dédiés), j'y ai pensé mais ça n'est pas directement applicable dans mon cas car j'utilise Spip, qui me sort automatiquement un blockquote quand j'entoure mon texte de <quote> et </quote>
Or je ne code pas du tout en PHP ni Javascript.

Solution 2 (ton deuxième message) : j'aime pas le bricolage. Smiley smile

On cherche ce qui est universel avant tout, non ? Smiley cligne
Modifié par olivier-m (07 Mar 2006 - 16:13)
PS : bref, j'ai ma réponse. C'est ce que je pensais mais je voulais avoir confirmation avant de refuser une modif.