28172 sujets

CSS et mise en forme, CSS3

Bonjour,

j'ai un petit soucis de liste, que je ne sais pas résoudre. Sur cette page, j'ai créé un post de test avec une liste: http://poker.vikchill.fr/test-liste/

On voit que la liste s'affiche avec une flèche, pas de problème, même si je n'arrive pas à comprendre pourquoi ni comment (il s'agit d'un template wordpress que j'essaie d'adapter, tant bien que mal). Le soucis est plus bas, avec les icones facebook et twitter dans "Partager". Vous conviendrez que c'est assez disgracieux, mais je ne sais pas comment faire pour ne pas avoir ces flèches pour la partie "Partager" seulement.

Une âme charitable pour m'aider?
salut,
en fait y'a des balises <i> dans .sd-content>li, il te suffit de les supprimer et tout rentrera dans l'ordre.
Bonjour,

<ul>
<li class="share-facebook">
[b]<i></i>[/b]
<div class="like_button">
</li>
<li class="share-twitter">
[b]<i></i>[/b]
<div class="twitter_button">
</li>
<li class="share-end">
[b]<i></i>[/b]
</li>
</ul>

Il suffirait de ne pas mettre la balise de mise en forme italique dans cette liste...
Merci à vous deux. Grâce à vous, j'ai désormais compris ce qui se passait, mais je ne sais toujours pas comment le résoudre: ces balises <i><i/> sont insérées par le template que j'utilise:


a écrit :
Add all the CSS selectors, one by line, into which you want to "prepend" (insert at beginning) a <i> tag. Example:

<li>
	<i></i>   <-- This is the prepended tag for the icon
	<a href"...">Link Text</a>
</li>


This tag is not inserted per default because it is only needed for adding icons to HTML elements such as links or titles. A <i> is used for brevity, this could also have been a <span> tag. The need for an extra tag is caused by the usage of "CSS Sprite Images" for icons. These images have many icons side by side and by adding an extra tag just for the icon it will be avoided that the other neighbor icons "lurk through" the background.

.widget ul li
.widget h3
.breadcrumbs ol li
.comment-text ul li
li.has-sub-menu a
.menu > li > a
.post-tags
.post-categories
.hentry ul li


Manifestement, c'est ce dernier .hentry ul li qui fait apparaître la flèche, en insérant les fameuses balises. Mais comment empêcher ce comportement? Ou comment contourner la difficulté? Est-il possible de mettre autre chose (idéalement rien) à la place des flèches pour les <i> dans .sd-content ?
Plus exactement :

.hentry ul li i,
.comment-text ul li i {
	display: 				inline-block;
	width: 					12px; 
	height: 					12px; 
	margin-right: 			10px; 
	margin-left: 			-20px;
	background: 			transparent url(http://poker.vikchill.fr/wp-content/themes/montezuma/images/icons.png) -48px -84px no-repeat;
}

.hentry ul ul li i,
.comment-text ul ul li i {
	background: 			transparent url(http://poker.vikchill.fr/wp-content/themes/montezuma/images/icons.png) 0px -48px no-repeat;
}

Il devrait suffir de venir "écraser" cette propriété en rajoutant juste après les lignes citées ci-dessus :

.sd-content ul li i {background:none;}