28173 sujets

CSS et mise en forme, CSS3

Bonjour,

Je vous expose rapidement ce que j'essaie de réaliser.

Dans une div de 750 pxls de large, j'ai placé un damier de 24 petites images (4 lignes de 6 images) dont la largeur totale est de 590 pxls.
Sur la gauche de ce casier, dans les 160 pxls restants, je veux placer une zone de commentaires fixe dont le contenu n'apparaîtrait qu'au survol des images par la souris (il s'entend que les commentaires diffèrent suivant chaque image survolée).
Voici donc mon problème : la chose fonctionne parfaitement sous FF (ferrage en haut à gauche), mais IE la gère bizarrement (la zone de commentaires n'est pas ferrée à gauche : elle se promène de gauche à droite suivant l'image survolée).

Je vous donne un aperçu de ce que cela donne sous FF lors du survol d'une image (légende de couleur verte).

upload/6038-casier.gif

Je suis sûr que vous saurez résoudre mon 'ptit problème (je débute...), et vous en remercie d'avance...

Voici le code html du damier (seule la 1ère ligne d'images n'apparait) :

<div id="casier">

  <a href="#"><img src="monimage01.gif" class="case"><span>commentaire01</span></a>

  <a href="#"><img src="monimage02.gif" class="case"><span>commentaire02</span></a>

  <a href="#"><img src="monimage03.gif" class="case"><span>commentaire03</span></a>

  <a href="#"><img src="monimage04.gif" class="case"><span>commentaire04</span></a>

  <a href="#"><img src="monimage05.gif" class="case"><span>commentaire05</span></a>

  <a href="#"><img src="monimage06.gif" class="case"><span>commentaire06</span></a>

  <br>

/*etc, etc,...*/



Voici un extrait de ma feuille de style :


.case {

	text-align: right;

	vertical-align: middle;

	margin-top: 5px;

	margin-right: 10px;

	margin-bottom: 5px;

	text-decoration: none;

}

div#casier {

	width: 750px;

	margin-top: 10px;

	margin-bottom: 10px;

	text-align: right;

}

div#casier a span {

	display: none;

	text-decoration: none;

}

div#casier a:hover span {

	display: block;

	position: absolute;

	top: 170px;

	left: auto;

	width: 160px;

	color: #99CC33;

	font: 8pt Verdana;

	text-align: left;

	padding-top: 10px;

	padding-left: 10px;

	clear: left;

	float: left;

	background-attachment: scroll;

	background-image: url(bordure.gif);

	background-repeat: no-repeat;

	background-position: left top;

}

div#casier a:hover {

	background-color: #333333;

}
Quid du left:auto en positionnement absolu ? Comment est-ce supposé fonctionner ? (s'il y a un article là-dessus, je suis preneur).

Et pourquoi le span est-il en positionnement absolu ET en flottant ?

Enfin, pour éviter d'hypothétique problèmes, j'aurais mis toutes les propriétés sur le sélecteur div#casier a span, et je n'aurais mis que le display: block à activer au survol.
Modifié par mpop (19 Apr 2006 - 19:04)
B3n a écrit :
de l'aide s'il vous plaît...
merci Smiley cligne

Deux jours plus tard, inconnu au bataillon… le problème avec les nouveaux inscrits sur le forum, c'est qu'un sur deux disparaît sans laisser de traces. Ce qui motive vachement pour filer un coup de main à un nouvel inscrit. Allez, je laisse encore quelques jours de sursis à B3n.
Une autre chose, comme on a pas le test en ligne, impossible de voir si le travail a évolué, ou s'il s'en est plus ou moins désintéressé.
Message posté à 16h00, relance un peu plus d'une heure plus tard (c'est ce qu'on appelle de la patience…), et puis plus rien même quand on a obtenu une réponse. Je trouve ça un peu limite.

Dans la foulée, ce message est une reprise en grande partie d'un premier message créé une semaine plus tôt par le même utilisateur. Les bons usages sur un forum auraient voulu que l'on mette à jour le premier message, plutôt que de créer un doublon.

Pff… voilà, maintenant je râle. Smiley decu
mpop a écrit :


Pff… voilà, maintenant je râle. Smiley decu


Et tu as bien raison parce que ceux qui en pâtissent, comme tu l'as indiqué dans ton message précédent, c'est bien les nouveaux venus motivés eux et qui risquent d'être un peu délaissés tant ceux qui aident ont trop souvent l'impression d'intervenir pour rien.

L'enjeu est donc important et dépasse le caractère simplement agaçant de l'esprit fast food.
Mardi 25 avril au soir, toujours pas de nouvelles malgré un message envoyé hier soir. Tant pis.
Une absence prolongée de ma part ainsi qu'un problème de messagerie à mon bureau ont fait que je n'ai pu consulter le forum ces deux dernières semaines et recevoir vos posts par courriels...
Je vous remercie néanmoins pour les posts que vous m'avez adressés... j'en conserve un seul en mémoire, à savoir le premier qui me donne quelques billes pour résoudre mon problème. Je m'y attache dès que je peux.
Merci en tous cas d'avoir pris le temps de me répondre.
A bientôt.
Smiley confus