28220 sujets

CSS et mise en forme, CSS3

Bonjour,
Je suis sonfronté à un petit soucis d'affichage d'une image contenu dans une cellule <td/>.
dans ma CSS, l'image est en display:none;
ce qui signifie que l'espace reservé pour cette image n'est pas pris en compte.
Mais dès qu'elle apparaît grâce à ma pseudo class :hover, le navigateur redimmensionne la cellule contenante pour faire apparaître mon image.
Mais je ne souhaite pas que la taille de la cellule soit modifée, je souhaite que l'image prenne la place nécessaire en superposition des autres cellules.
Par ailleurs il m'est difficile d'envisager de coder en dur la hauteur de ma cellulle car le texte contenu dedans est dynamique, la cellule peut aller jusqu'a 3 lignes de texte, et je ne souhaite pas obtenir des cellules trop grande par rapport au texte contenu .

est-ce possible ?
avez vous une idée. ?

merci d'avance.
Modifié par stagiaire2.nord (09 Sep 2005 - 14:19)
Salut,

si je comprends bien, tu veux que ta cellule soit toujours affichée de la même taille même quand ta souris n'est pas dessus.
tu dois utiliser à la place de display: none;
visibility: hidden;

Pour éviter de fixer une taille absolue, le mieux est de répéter ton image
td#machin (background: url(ton_image.jpg) repeat-x;)
par exemple pour que ton image se répète dans le sens horizontal.

Voilou
Salut, merci de te pencher sur ma question,

a écrit :

si je comprends bien, tu veux que ta cellule soit toujours affichée de la même taille même quand ta souris n'est pas dessus.
tu dois utiliser à la place de display: none;
visibility: hidden;

Et bien ce n'est pas tout à fait ça.
je veux que ma cellule ait tout le temps la même dimension même lorsque je passe dessus.
si je fais visibility:hidden, ce sera pire car l'espace de l'image sera reservé même lorsqu'elle ne sera pas affichée.
a écrit :

Pour éviter de fixer une taille absolue, le mieux est de répéter ton image
td#machin (background: url(ton_image.jpg) repeat-x;)
par exemple pour que ton image se répète dans le sens horizontal.

l'image est obligatoirement insérée dans le code xHTML il ne s'agit pas d'un d'un bg, mais bien d'une balise <img/>
je travaille avec une base de donnée dérrière, j'ai une image différente sur chaque ligne.

J'espère être clair dans ma formulation. Smiley smile
à tantôt je l'espère.
Peux tu fixer une taille maximale pour ton image ?
La cellule de ton texte, si tu ne lui a pas fixé de taille, s'adaptera à sa hauteur dans le cas où ton texte est plus grand que l'image.
Modifié par ShakalX (09 Sep 2005 - 16:29)
a écrit :

Peux tu fixer une taille maximale pour ton image ?
La cellule de ton texte, si tu ne lui a pas fixé de taille, s'adaptera à sa hauteur dans le cas où ton texte est plus grand que l'image.

Oui la taille max est définie.
Que la cellule s'adapte au texte->c'est ce que j'ai actuellement, et ce que je désire, il n'y a donc pas de pb de ce côté là.
Que la cellule s'adapte à l'image->je veux l'eviter, je souhaite que l'image dépasse la cellule sans la redimensionner.

c'est un truc de tordu je sais.
Je vois ce que tu veux dire, mais disons que si tu fais un tableau avec pour chaque ligne (ton image et ton texte), au point de vue mise en page, ça sera pas terrible.
===> Soit les images se chevaucheront si ton tableau est classique (dans sa mise en page), sinon si tu mets une marge entre chaque ligne, ça revient au même que de se baser sur la hauteur de ton image ...
Modifié par ShakalX (10 Sep 2005 - 14:10)
Merci, mais je ne souhaite pas discuter de mes choix de mise en page que tu n'as pas l'air de bien visualiser, mais bien de résoudre un problème technique.

C'est peut-être impossible ce que je demande...