[CSS]positionnement d'un élément par rapport à un autre

Bonjour,

Dans ma page j'ai deux éléments. je voudrais que le second soit tout le temps positionné juste en dessous du premier, sachant que la position du premier n'est pas fixe dans la page.

voila un extrait du code html :

Code:

1
2
3
4
5
6
7
8
9
10
 
<div class="formPave" style="width: 95%;">
<div class="formChamp" id="champAff" style="">
  <span class="formChamp">Ancienne valeur</span>
  <span class="formChamp"><input class="normal" name="champ" value="" size="30" style="" id="champ" type="text"></span>
</div>
<ul class="Ressuggest" id="Reschamp" style="position: absolute; visibility: hidden; display: none; height: 0px;">
  <li class="lisuggest"><b>coucou</li>
</ul>
</div>

et un bout de la css :

Code:

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
 
.normal {
    padding:1px;
    border: #7093DB;
    font-size: 12px;
    color: #336699
}
 
.formPave {
    float: left;
    font-size: 11px;
    background-color: #DCF0FF;
    color: #336699;
    margin-bottom: 15px;
    padding-top: 4px;
    padding-left: 4px;
    padding-bottom: 4px;
}
 
.formChamp {
    float: left;
    margin: 0px;
    padding: 0px;
    width: 95%;
}
 
.Ressuggest {
    color:white;
    background-color:#FFFFFF;
    width:196px;
    list-style-type:none;
    text-align:left;
    margin:0px 0px 0px 0px;
    padding:0px 0px 0px 0px;
}
 
#Reschamp {
    position:relative;
    top:10px;
}
 
li.lisuggest {
    background-color:#FFFFFF;
}

je voudrais donc positionner "reschamp" juste en dessous de "champ". mais apparemment je m'y prends mal...
est-ce que quelqu'un aurait une solution (qui fonctionne sous IE et Firefox) ? ou peut-être que ce n'est pas possible ?
merci d'avance