positionnement relatif de 2 blocs

**pop_up** · 12/02/2008, 15h09

Bonjour,

J'ai un peu de mal avec le positionnement relatif.
Comment faut t'il l'utiliser exactement ?

Je cherche à positionner deux blocs sur la meme ligne.

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
 
<div id="menuHaut">
    <div class="menuHautGauche">
      <ul>
        <li ><a href="#" >menu</a></li>
        <li ><a href="#" >menu</a></li>
        <li ><a href="#" >menu</a></li>
        <li ><a href="#" >menu</a></li>
        <li ><a href="#" >menu</a></li>
      </ul>
    </div>
    <div class="menuHautDroite">
      <ul>
        <li ><a href="#" >menu</a></li>
        <li ><a href="#" >menu</a></li>
       </ul>
    </div>
</div>

le menuHaut fait une largeur de 100%

le menuHautGauche doit etre positionné normalement à partir de la gauche et doit avoir une largeur automatique

le menuHautDroite doit etre collé à droite et doit faire 20em de largeur.

j'avais mis position: relative; et right: 0; mais ça ne le positionne pas à droite

c'est pas comme ça qu'il faut faire ?

merci

**Palca** · 12/02/2008, 20h40

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
<html>
<head>
<style type="text/css">
.menuHautDroite { width: 20em; float: right; }
</style>
</head>
<body>
<div id="menuHaut">
    <div class="menuHautDroite">
      <ul>
        <li ><a href="#" >menu</a></li>
        <li ><a href="#" >menu</a></li>
       </ul>
    </div>
    <div class="menuHautGauche">
      <ul>
        <li ><a href="#" >menu</a></li>
        <li ><a href="#" >menu</a></li>
        <li ><a href="#" >menu</a></li>
        <li ><a href="#" >menu</a></li>
        <li ><a href="#" >menu</a></li>
      </ul>
    </div>
 
</div>
</body>
</html>

A modifier selon tes besoins.

A noter qu'il faut mettre le menuHautDroite avant menuHautGauche dans la page html pour que le positionnement soit à la bonne hauteur.

**pop_up** · 13/02/2008, 08h38

Merci pour ta reponse mais ce n'est pas ça que je cherche. Avec le float right, j'avais trouvé mais la je cherche vraiment a le faire en relatif. la partie droite doit etre obligatoirement après la gauche pour des raison d'accessibilité.

positionnement relatif de 2 blocs

Positionnement en CSS

Discussions similaires

Partager

Partager