[XHTML] Un div avec position absolute et centré

**Emotion** · 22/04/2007, 21h55

Bonjour,

Je fais appel à ceux qui s'y connaissent vraiment bien en xhtml, puisque j'ai un peu de mal à optimiser ma div...

Voilà le site que je suis en train de développer :
http://testscolaire.ovh.org/vv2/

Si vous passez la souris sur "Les forums", figurant dans le menu de gauche, une div à gros cadre noir apparaît.

Si vous regardez un peu mon code source le contenu de cette div est le suivant :

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
36
37
38
39
40
41
<div id="bulle_info" style="position:absolute;display:none" align="center">
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<table width="100%">
<tr>
<td align="center">
<div style="background:url(img/fond12.gif) repeat-x #fcfcfe;border:3px solid #000000;width:320px;font-family:verdana;font-size:12px;padding-left:7px;padding-right:7px"><br />
<br />
Les <b>forums</b>&nbsp;: <b>module incoutournable</b> d'EntraideScolaire.com&nbsp;!
<div align="left">
<br />
<br />
Vous pouvez&nbsp;:
<br />
<br />
&bull;&nbsp;Y poser vos questions scolaires et proposer votre aide
<br />
<br />
&bull;&nbsp;Y faires des propositions et parler du site en général
<br />
<br />
&bull;&nbsp;Y créer des sondages en tout genre
<br />
<br />
&bull;&nbsp;Vous y divertir, faire des jeux, débattre sur l'actualité, coin humour etc.
</span>
<br />
<br />
<br />
</div>
</td>
</tr>
</table>
</div>

C'est un bidouillage d'imbrications à coucher dehors, auquel j'ai eu recourt car je n'arrivais pas à centrer correctement ma div avec la présence simultanée de "position:absolute".

Je fais appel à vous pour qu'une âme sympa, qui s'y connaisse en xhtml puisse m'optimiser mon code en une seule balise div (et que la div soit centrée par rapport à la fenêtre, si possible).

Merci par avance

Bonne soirée.

Guillaume

**SpaceFrog** · 23/04/2007, 10h41

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
<style type='text/css'>
#container{	position:absolute;
     left: 50%; 
     top: 50%;
     width: 400px;
     height: 300px;
     margin-top: -150px; /* moitié de la hauteur */
     margin-left: -200px; /* moitié de la largeur */
     border: solid 1px red;
     }
 </style>    
<title>Nouvelle page 1</title>
</head>
 
<body>
<div id="container"> contenu</div>
</body>

**Emotion** · 23/04/2007, 15h02

merci

[XHTML] Un div avec position absolute et centré

HTML

Discussions similaires

Partager

Partager