28172 sujets

CSS et mise en forme, CSS3

bonjour,

Pour voir le problèmes cliquez ici testez sous Firefox et Internet explorer !


le code html :

<ul id="tut">
	<li><div style="width:680px; float:left"><a href="http://www.forum-vista.net/astuces_vista/les_flux_rss_dans_i_e_7-a4.htm">Les flux RSS dans I.E.7</a></div>
	<div style="width:80px; float:left">vu 38 fois </div>
	<div style="width:80px; float:left">le 06.11.2007</div></li>
</ul>




Le css :


#tut li{
	background-image: url(imagesv2/pastaga.gif);
	background-repeat: no-repeat;
	background-position: left center;
	list-style-type: none;
	padding-left: 12px;
	width:850px;
	border-bottom-width: thin;
	border-bottom-style: dashed;
	border-bottom-color: #EEEEEE;
	line-height: 20px;
}

#tut li:hover {
	border-bottom-width: thin;
	border-bottom-style: dashed;
	border-bottom-color: #D0D6F0;
	width:850px;
	padding-left: 12px;
	}
	



J'ai essayer plusieurs techniques différentes mais je ne trouve pas le joint ...

merci de votre aide.
Salut,

- tu ne peux pas avoir plusieurs éléments avec le même id. Il faudra que tu transformes tes ul id="tut" en ul class="tut" (et dans ta CSS, .tut au lieu de #tut)

- ajoute une instruction à tes ul pour qu'ils se placent sous les flottants qui les précèdent
ul.tut { clear: left; }


- pourquoi ne pas utiliser un tableau dans ce cas ?
bha je suis un peu perdu pour ce qui est de la css... je sais plus quand il faut utiliser les tableaux, quand utiliser les div ...

j'ai intégré le clear: left; dans le LI et non dans le UL ca fonctionne, par contre je ne comprends pas pourquoi je n'ai pas mes puces sous firefox... ?? une idée ?
Bonsoir mims1664,

Pour tes puces qui ne s'affichent pas sous Firefox, je n'ai pas l'explication (et j'ai la flemme de chercher... Smiley confused ) mais pourquoi ne pas utiliser list-style-image ?

.tut li {
border-bottom:thin dashed #EEEEEE;
clear:left;
line-height:20px;
list-style-image:url(pastaga.gif);
width:850px;
}
.tut li:hover {
border-bottom:thin dashed #D0D6F0;
width:850px;
}


Fonctionne sous Firefox, IE6et7, mais a priori pas sur Opéra Smiley cligne

[-hs] Entre ton pseudo et celui de l'image de ta puce (pastaga.gif) je commence à me faire une idée du personnage!!! Smiley lol Smiley cligne [/hs]

Cdt,
Sylvain
Modifié par 6l20 (22 Feb 2008 - 00:38)
...Grrr ça devrait fonctionner sous Opéra, je suppute un problème avec la position float, mais je ne parviens pas à trouver ! Grrrr...
LOL pastaga ... en plus je ne suis pas fan .... bha pastille était déja pris, pastille 1 aussi, pastille 2, bon ... ca m'est venu a l'espris comme ca, apres c'est sur que ce qui aurait pu venir a l'espris aussi c'est "fleche" LOL

Merci beau t'est un as ca fonctionne déja sous IE et Firefox... c'est deja super. Smiley cligne