Salut,

J'ai pu utiliser avec succès le display:inline, en revanche, le display:inline-block semble avoir un comportement total aléatoire...

J'ai bien noté qu'il fallait utiliser

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
 
display: -moz-inline-block;
display: -moz-inline-box;
display: inline-block;
pour obtenir du cross platform mais je n'arrive pas à faire ce que je veux, à savoir ça :

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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
	<head>
		<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
		<title>Test</title>
		<style type="text/css">
                html{
                        height:100%;
                        width:100%;
                }
                body{
                        margin:0;
                        height:100%;
                        width:100%;
                }
                #tblEnveloppe{
                        height:100%;
                        width:100%;
                        border:solid 2px cyan;
                        position:relative;
                }
                #tdLeftBorder{
                        width:auto;
                        background-image:url(http://www.ezlogicfrance.com/ClientsFolder/37307/images/squelette/fondgauche.png);
                        background-position:right bottom;
                        background-repeat:no-repeat
                }
                #tdRightBorder{
                        width:auto;
                        background-image:url(http://www.ezlogicfrance.com/ClientsFolder/37307/images/squelette/fonddroit.png);
                        background-position:left bottom;
                        background-repeat:no-repeat
                }
                #tdMain{
                        /* fixe la hauteur minimum de la page */
                        width:800px;
                        height:748px;
                }
                #divRightBorder{
                        width:auto;
                        background-image:url(/ClientsFolder/37307/images/squelette/fonddroit.png);
                        background-position:left bottom;
                        background-repeat:no-repeat
                }
                #divMain{
                        /* Zone "contenu" */
                        vertical-align:top;
                        height:100%;
                        position:relative;
                }
                .box{
                        /* just for fun */
                        width:50px;
                        width:50px;
                        vertical-align:middle;
                        text-align:center;
                        border:1px dashed orange;
                        display:block;
                }
                
                </style>
	</head>
	<body>
		<table id="tblEnveloppe" border="0" cellpadding="0" cellspacing="0">
			<tr>
				<td id="tdLeftBorder">
					<div class="box">Left</div>
				</td>
				<td id="tdMain">
					<div id="divMain">
						hello
						<p>coucou</p>
						<div style="position:absolute;left:40px;top:50px;width:100px;height:50px;">Positionné</div>
					</div>
				</td>
				<td id="tdRightBorder">
					<div class="box">Right</div>
				</td>
			</tr>
		</table>
	</body>
</html>
Je crois qu'il y a un moment ou le purisme doit laisser ça place au sens pratique... Je n'ai pas l'impression que nos derniers navigateurs soient prêts pour totalement se passer des tables...

Notez, qu'il est possible que je ne connaisse pas la technique, en conséquence, si vous la connaissez, n'hésitez pas...

++

Laurent