Discussion :

[Tententai]

Bonjour,

J'aimerais faire la chose suivante : dessiner une colonne en 3D, celle ci étant composé de 3 images :
- le haut, taille fixe.
- le milieu, taille variable en fonction d'une donnée.
- le bas, taille fixe.

Pour l'instant je le fais avec trois balises <tr></tr> contenant une <td></td> chacune.

Mon problème est que quand la donnée qui définit la taille de la cellule du milieu est très petite, cette cellule devrait être très petite également. Or dans cette cellule l'image est l'arrière plan, et le nombre est écrit à l'intérieur, elle a donc une taille minimale qui correspond à la police d'écriture de ce nombre.

Comment faire pour écrire ce nombre "à cheval" sur les 3 images ?

Merci pour vos idées

[Strix]

Salut. Tu aurais du code et/ou une image à montrer ?
Ce sera plus facile pour te répondre

[MasterOfChakhaL]

Salut,

Qu'est-ce que tu entends par dessiner une colonne en 3D?
Quand tu parles de taille fixe ou non, tu parles de largeur, de hauteur ou les deux?

[cadoudal56]

Pas de moyen simple...
Le seul que je vois est de déclarer une DIV que tu positionneras au dessus du tableau avec un positionnement fixe....

En partant du principe que la largeur est fixe (20 pixels) et la hauteur variable et calculée dynamiquement (via un script) pour le millieu et que haut et bas sont fixes (20 pixels * 20 pixels)
En partant du principe que tu gère tes arrieres plans en css


Les ??? doivent etre remplacés et ceux du DIV doivent etre égal à 40pix + ta valeur

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<table>
<tr><td style="background-image : url(haut.gif); width:20px; height:20px"><div style="position:absolute; width:20px; height:???;">MaValeur</div></td></tr>
<tr><td style="background-image : url(middle.gif); background-repeat: repeat-y; width:20px; height:???"></td></tr>
<tr><td style="background-image : url(bas.gif); width:20px; height:20px"></td></tr>
</table>

Sinon tu ne te casse pas la tete et tu mets ta valeur dans la ligne du dessous
si absolute ne fonctionne pas essaie relative

@+
cadou

[Tententai]

Hello,

Désolé pour le manque de détails, mais oui effectivement il s'agit d'empiler trois images de largeur fixe, dont celle du milieu a une hauteur variable et contient un texte, sans que cette cellule du milieu ait au minimum la hauteur de la police du texte.

Je ne connaissais pas postion:absolute, ça va être laborieux mais ça résoud mon problème. Merci