2 Div (1fixe, 1 variable) imbriqué dans un div

**fabou3377** · 14/02/2010, 10h45

Bonjour,

j'aimerais imbriqué dans un div deux div le premier d'un largeur fixe le deuxième prenant le reste de la largeur ... Le problème c'est que le deuxième ne prend pas toute la largeur...

Voici mon code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
 <div id="structure">
            <div id="sections">sections </div>
            <div id="properties">properties </div>
            <div class="spacer"></div>
        </div>

mon 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
/* + Struture Page */
#structure{
    float: left;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
    background: aqua; 
}
#structure div{
    background-color: #ff6600;
    margin:0;
}
 
#structure #sections{
    float: left;
    width : 300px;
 
}
 
#structure #properties{
    float: right;
 
}

Merci d'avance

**Macmillenium** · 15/02/2010, 13h54

Bonjour,

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
#structure #properties{
    /* float: right; */
    overflow:hidden
}

Et entre <head></head> :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<!--[if IE 6]>
   <style type="text/css" media="screen">
       #structure #properties{
         zoom:1
        }      
   </style>
<![endif]-->

Le overflow:hidden établit un nouveau contexte de formatage bloc (en) ce qui permet à la div #properties d'occuper le reste de largeur disponible en tenant compte de la présence de l'adjacent flottant.
IE6 n'établit pas de contexte de formatage mais reproduit un comportement similaire en activant le layout, d'où le zoom:1 entre commentaires conditionnels.

2 Div (1fixe, 1 variable) imbriqué dans un div

CSS

Vue hybride

Discussions similaires

Partager

Partager