[HTML][CSS] Ecrire du texte par dessus un tableau.

**Joad** · 07/04/2005, 11h57

Bonjour !

Je dispose d'un tableau dans lequel, dans l'une des cellule, j'affiche un autre tableau.

Par dessus ce dernier tableau, j'aimerai afficher un texte centré.

J'ai pensé a utiliser une <div> comme un calque mais je ne sais pas trop quels attributs lui donner.

Est-ce la bonne solution ? Quels attributs alors puis-je lui donner ?

Merci d'avance!

**tyx** · 07/04/2005, 12h48

Je ne saisis pas l'interet de la chose mais un effectivement un div en positionnement absolu donc sur le principe

Code :

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

1
2
3
4
5
6
7
8
 
div#rustine {
position: absolute ;
top: XX ;
left: XX ;
width: XX ;
height: XX ;
}

Ces propriétés devraient être suffisantes à la réalisation de ton ptit truc suffit de mettre les bonnes valeurs ^^

**Kerod** · 07/04/2005, 12h49

Donne un exmple de ce que tu veux faire stp

**Joad** · 07/04/2005, 14h21

Ok, je vais essayer de vous expliquer exactement ce que je veux faire :

J'ai un tableau principal.
Dans chaque case de ce tableau, j'affiche une barre d'état d'avancement (progress bar) qui est en fait constitué d'un tableau dans lequel j'ajuste la largeur des cellules.

Code :

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

1
2
 
<TABLE CELLPADDING=0 CELLSPACING=0 class="progressmain"><TR><TD class="status" width="20%"></TD><TD width="80%"></TD></TR></TABLE>

J'aimerai pouvoir mettre un titre en plein milieu de cette bar d'état d'avancement comme dans cet exemple :

J'espere avoir été clair

Une idée ?

**balu** · 07/04/2005, 17h43

***solution effacée***

J'ai enlevé cette première solution car c'était une solution en php pour afficher une barre de progression.

**Joad** · 07/04/2005, 18h03

Merci pour ce code mais comme je l'ai spécifié je ne veux que du html css

Quelqu'un a une autre idéé ?

**balu** · 07/04/2005, 19h01

Autre solution html/css :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<html>
<head>
<title>Barre de progression</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style>
div#barre {
	position: relative;
	border: 1px solid #000000;
}
 
span#texte {
	position: absolute;
	width: 100%;
	height: 20px;
	top: 50%;
	margin-top: -10px;
	text-align: center;
}
</style>
</head>
 
<body>
 
<div id="barre"> 
  <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr> 
      <td width="60%" bgcolor="#ffff00">&nbsp;</td>
      <td width="40%" bgcolor="#ff0000">&nbsp;</td>
    </tr>
  </table>
  <span id="texte">MON TEXTE</span>
</div>
 
</body>
</html>

Tu places le div barre à l'intérieur des cellules de ton tableau principal où la barre doit apparaître.

**Joad** · 08/04/2005, 10h16

Génial Balu ! C'est exactement ce qu'il me faut !!!!!

Je te remercie sincérement !

**Ricou13** · 14/04/2005, 02h32

Salut,

Balu, 3 questions:

1) quel est l'intéret de mettre position:relative sur div#barre puisque un calque dont la position n'est pas spécifié est implicitement en position "relative" ?

2) Ne serait-il pas plus propre pour le span d'écrire "div#barre span#texte" ou "#barre #texte" ou "#barre span"(puisqu'il n'y en a qu'un seul). Enfin, bref, de spécifier que ce span est imbriqué dans #barre ?

3) Le résultat est statique et la barre ne progressera donc pas !

[HTML][CSS] Ecrire du texte par dessus un tableau.

Positionnement en CSS avec z-index

Vue hybride

Discussions similaires

Partager

Partager