Bonjour,
j'ai dés soucis css avec tout ces spans et classes auto généré par SPIP
et pour une fois ces dans IE que ça marche (prèsque) sans problèmes
Dans un div j'ai une liste d'articles qui ne contiennent que des images
voici ma boucle :
<div id="contenu" >
<BOUCLE_index_galerie(RUBRIQUES){id_parent}>
<BOUCLE_liste_article_image(ARTICLES){id_rubrique}{par titre}>
[(#TEXTE|image_reduire{90,90})]
</BOUCLE_liste_article_image>
</BOUCLE_index_galerie>
</div>
Dans ma page calculé cela me donne dans mon div des
span="spip_documents" qui contionnent chaque fois une image
voici le css que j'ai donné aux éléments
span.spip_documents
{
position:relative;
width:88px; height:88px;
_width:92px; _height:92px;
padding:0; margin:1px;
border:1px solid #080476;
display: inline;
background-color:#fff;
}
span.spip_documents img
{
margin:0; padding:0;
}
et voici vous pouvez voir le résultat :
http://www.treibgut.be/en_travaux/spip.php?article13&id_rub=4
dans Firefox le span.spip_documents ne prend pas le dimensions demandés,
ce qui cause que les images ne sont pas alignés régulièrement. Est-ce
que qqun sais ou est mon erreur?
joz
-----Message d'origine-----
De : spip-bounces@rezo.net [mailto:spip-bounces@rezo.net] De
la part de joz
Envoyé : mardi 7 novembre 2006 19:10
À : spip-discussions
Objet : [Spip] problème css
Dans un div j'ai une liste d'articles qui ne contiennent que
des images voici ma boucle :
<div id="contenu" >
<BOUCLE_index_galerie(RUBRIQUES){id_parent}>
<BOUCLE_liste_article_image(ARTICLES){id_rubrique}{par titre}>
[(#TEXTE|image_reduire{90,90})]
</BOUCLE_liste_article_image>
</BOUCLE_index_galerie>
</div>
Dans ma page calculé cela me donne dans mon div des
span="spip_documents" qui contionnent chaque fois une image
voici le css que j'ai donné aux éléments
span.spip_documents
{
position:relative;
width:88px; height:88px;
_width:92px; _height:92px;
padding:0; margin:1px;
border:1px solid #080476;
display: inline;
background-color:#fff;
}
span.spip_documents img
{
margin:0; padding:0;
}
et voici vous pouvez voir le résultat :
http://www.treibgut.be/en_travaux/spip.php?article13&id_rub=4
dans Firefox le span.spip_documents ne prend pas le
dimensions demandés, ce qui cause que les images ne sont pas
alignés régulièrement. Est-ce que qqun sais ou est mon erreur?
Oui. C'est parce que les images sont des éléments en ligne. Donc
j'ajouterais :
span.spip_documents img
display: block;
margin: 0;
padding: 0;
}
Ou alors un display: block sur span.spip_documents...
Olivier GENDRIN schrieb:
-----Message d'origine-----
De : [] De
la part de joz
Envoyé : mardi 7 novembre 2006 19:10
À : spip-discussions
Objet : [Spip] problème css
Dans un div j'ai une liste d'articles qui ne contiennent que
des images voici ma boucle :
<div id="contenu" >
<BOUCLE_index_galerie(RUBRIQUES){id_parent}>
<BOUCLE_liste_article_image(ARTICLES){id_rubrique}{par titre}>
[(#TEXTE|image_reduire{90,90})]
</BOUCLE_liste_article_image>
</BOUCLE_index_galerie>
</div>
Dans ma page calculé cela me donne dans mon div des
span="spip_documents" qui contionnent chaque fois une image
voici le css que j'ai donné aux éléments
span.spip_documents
{
position:relative;
width:88px; height:88px;
_width:92px; _height:92px;
padding:0; margin:1px;
border:1px solid #080476;
display: inline;
background-color:#fff;
}
span.spip_documents img
{
margin:0; padding:0;
}
et voici vous pouvez voir le résultat :
dans Firefox le span.spip_documents ne prend pas le
dimensions demandés, ce qui cause que les images ne sont pas
alignés régulièrement. Est-ce que qqun sais ou est mon erreur?
Oui. C'est parce que les images sont des éléments en ligne. Donc
j'ajouterais :
span.spip_documents img
display: block;
margin: 0;
padding: 0;
}
Ou alors un display: block sur span.spip_documents...
avec display: block (n’importe si dan span.spip_documents ou dans span.spip_documents img ) les dimensions sont correctes mais mes images se trouvent un en dessous de l’autre.
c’est un cercle vicieus … display: block arrange les dimensions et display:inline le bon alignement
suis un peux perdu 
joz
salut, tu as essayer
#contenu span
{
position:relative;
width:88px; height:88px;
_width:92px; _height:92px;
padding:0; margin:1px;
border:1px solid #080476;
display: inline;
background-color:#fff;
}
span.spip_documents img
{
margin:0; padding:0;
}
@plus karim
--
dsl pour les accents, clavier querty 
karim belkacem schrieb:
salut, tu as essayer
#contenu span
{
position:relative;
width:88px; height:88px;
_width:92px; _height:92px;
padding:0; margin:1px;
border:1px solid #080476;
display: inline;
background-color:#fff;
}
span.spip_documents img
{
margin:0; padding:0;
}
@plus karim
je ne comprend pas qu'est-ce que tu me conseilles...
??
joz
joz schrieb:
Olivier GENDRIN schrieb:
-----Message d'origine-----
De : [] De
la part de joz
Envoyé : mardi 7 novembre 2006 19:10
À : spip-discussions
Objet : [Spip] problème css
Dans un div j'ai une liste d'articles qui ne contiennent que
des images voici ma boucle :
<div id="contenu" >
<BOUCLE_index_galerie(RUBRIQUES){id_parent}>
<BOUCLE_liste_article_image(ARTICLES){id_rubrique}{par titre}>
[(#TEXTE|image_reduire{90,90})]
</BOUCLE_liste_article_image>
</BOUCLE_index_galerie>
</div>
Dans ma page calculé cela me donne dans mon div des
span="spip_documents" qui contionnent chaque fois une image
voici le css que j'ai donné aux éléments
span.spip_documents
{
position:relative;
width:88px; height:88px;
_width:92px; _height:92px;
padding:0; margin:1px;
border:1px solid #080476;
display: inline;
background-color:#fff;
}
span.spip_documents img
{
margin:0; padding:0;
}
et voici vous pouvez voir le résultat :
dans Firefox le span.spip_documents ne prend pas le
dimensions demandés, ce qui cause que les images ne sont pas
alignés régulièrement. Est-ce que qqun sais ou est mon erreur?
Oui. C'est parce que les images sont des éléments en ligne. Donc
j'ajouterais :
span.spip_documents img
display: block;
margin: 0;
padding: 0;
}
Ou alors un display: block sur span.spip_documents...
avec display: block (n’importe si dan span.spip_documents ou dans span.spip_documents img ) les dimensions sont correctes mais mes images se trouvent un en dessous de l’autre.
c’est un cercle vicieus … display: block arrange les dimensions et display:inline le bon alignement
suis un peux perdu
joz
float:left; était le mot magique qu’il me fallait … merci pour vos réponses joz
Bonjour,
Ta feuille de style fixe les dimensions du span.spip_documents et pas des images qu'ils contiennent. Tes images ont-elles bien toutes la même taille ?
Si ce n'est pas le cas, il faudrait peut-être qu'en CSS, tu fixes la taille des images dans ton sélecteur :
span.spip_documents img{width:88px; height:88px;}
Christian