J'ai un problème où le dernier élément li d'un ul se pousse plus à gauche que le reste de mes pièces. Ci-joint une capture d'écran et mon code.Ul Li dernier élément ne s'aligne pas correctement
J'ai essayé d'utiliser l'élément last-child mais cela ne fonctionne pas dans Safari ou Chrome.
#attending ul {
display: inline;
margin: 0 5px 0 0;
padding-left: 0px;
}
#attending ul li {
display: inline;
list-style-image:none;
padding: 5px;
}
#attending li:last-child {
margin-right:-4px;
}
Suggestions?
--------------- ÉDITÉ ----------------
#attending {
width: 230px;
margin:0 13px 5px 12px;
float: left;
background-image: url(...);
background-repeat: no-repeat;
text-align:center;
height:360px;
overflow:hidden;
}
<div id="attending">
<h2> Who's Attending <div id="eventtitle">Converge </div></h2>
<ul>
<li><a href='http://www.last.fm/user/IthisProtector' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/30769977.jpg' alt='IthisProtector' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/Jordan1124' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/46770143.jpg' alt='Jordan1124' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/redmedicine' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/1612965.jpg' alt='redmedicine' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/phillstac3' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/9373439.jpg' alt='phillstac3' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/hammajamma' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/1577940.gif' alt='hammajamma' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/tastemaker' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/31334281.jpg' alt='tastemaker' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/owlz' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/38409251.jpg' alt='owlz' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/cersei' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/16709925.png' alt='cersei' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/thenetsux' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/46964551.jpg' alt='thenetsux' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/Shwang_Shwinga' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/36391855.jpg' alt='Shwang_Shwinga' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/NightEndDay99' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/23687175.jpg' alt='NightEndDay99' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/aliciabandee' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/46562737.jpg' alt='aliciabandee' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/mcbaker2' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/5005584.jpg' alt='mcbaker2' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/killcarriedeadd' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/46160823.jpg' alt='killcarriedeadd' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/sexraptor89' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/44930901.gif' alt='sexraptor89' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/Johnny_Acidtrip' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/45211001.png' alt='Johnny_Acidtrip' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/chrismarzig' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/41573869.jpg' alt='chrismarzig' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/Lapp0' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/29210613.jpg' alt='Lapp0' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/iozephus' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/46560555.jpg' alt='iozephus' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/JoshTheChaos' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/41057871.jpg' alt='JoshTheChaos' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/ktdlmnop' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/46312475.jpg' alt='ktdlmnop' height=40px; width=40px; style='border:0px;'/></a></li><li><a href='http://www.last.fm/user/RheannaReverie' target='_blank'><img src='http://userserve-ak.last.fm/serve/34/46435589.jpg' alt='RheannaReverie' height=40px; width=40px; style='border:0px;'/></a></li> </ul>
</div>
Vous devez également inclure le code HTML. Cela devrait être facile à résoudre, mais nous avons besoin de tout le code pour vraiment aider. – Gabriel
J'ai du mal à visualiser cela avec l'aide de la capture d'écran. Est-ce que le '# participant 'a une largeur fixe? Chaque image est-elle représentée par un seul élément 'li'? Ou est-ce chaque rangée d'images? Quoi qu'il en soit, veuillez modifier et mettre à jour votre question pour inclure du code HTML pertinent. De préférence, un exemple copier'n'paste'n'runnable de '' jusqu'à ' '(et doctype) qui valide. – BalusC
Je ne suis pas sûr quel doctype il est en tant que son wordpress en cours d'exécution. Laissez-moi vérifier cela très rapidement. Le voici: XHTML 1.0 Transitional Je suppose que j'ai besoin de modifier cela à strict? non? – codeisforeva