Bonjour à tous,

Un petit problème qui devient gros vu le nombre d'heure que je passe à essayer de comprendre.

J'utilise 4 images pour effectuer les arrondis d'un cadre qui lui même contient un contenu.

Logiquement la div contenu devrait être tout en haut de la div cadre et tout en bas puisque puisque je lui donne une hauteur auto...

mais cela ne fonctionne pas...

Si quelqu'un a une solution...merci d'avance

Un petit tour sur mon code

HTML

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
 
<div id="corps">
 
	<div id="hautdroit"></div>
	<div id="hautgauche"></div>
	<div id="contenu">
	    <p><strong>gdhdhdhgh</strong></p>
	    <p><strong>dghgfhdgh</strong></p>
	    <p><strong>dghdgndndn</strong></p>
	    <p><strong>gnghhhghgh<br />
	    ghghghghgh</strong></p>
	</div>
             <div id="basdroit"></div>
	<div id="basgauche"></div>
</div>
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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
 
 
#corps
{
	width: 400px;
	margin-top: 40px;
	margin-right: 10px;
	margin-left: 250px;
	background-color: #FFFFFF;
	font-family: Tahoma;
	font-size: 12px;
	height: auto;
}
 
#hautgauche, #hautdroit, #basgauche, #basdroit
{
height: 19px; width: 19px;
background-repeat: no-repeat;
font-size:1px;
}
 
#hautgauche 
{
	background-image: url(images1/hautgauchecorps.gif);
}
 
 
#hautdroit 
{
	float: right;
	background-image: url(images1/hautdroitcorps.gif);
}
 
 
#basgauche 
{
background: url(images1/basgauchecorps.gif);
}
 
 
#basdroit 
{
float: right;
background: url(images1/basdroitcorps.gif);
}
 
 
#contenu
{
	padding-right: 1em;
	padding-left: 1em;
	height: auto;
	padding-bottom: 10px;
	display: block;
	border: 1px solid #0099FF;
}