Display inline block avec IE

**thecatz** · 24/09/2013, 14h30

Bonjour,

si quelqu'un pourrait me dire pourquoi cela ne fonctionne pas je suis preneur. Je n'ai pas l'habitude de développer pour IE, et du coup je patauge complètement. Je viens de faire un test basique :

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
#couleur {
    width:450px;
height:450px;
}
 
#rouge {
    display:inline-block;
    height:200px;
    width:200px;
    background-color: red; 
}
 
#bleu {
    display:inline-block;
    height:200px;
    width:200px;
    background-color: blue; 
}

Code html :

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

1
2
3
4
<div id="couleur">
<div id="rouge"></div>
<div id="bleu"></div>
</div>

http://jsbin.com/oLEtEqO/1/edit

Sur tous les navigateur hormis IE les deux blocs sont bien cote à cote mais sur IE ils sont l'un en dessous de l'autre.

Merci

**Torgar** · 24/09/2013, 14h46

Salut,

La valeur inline-block pour les versions IE <8 ne s'applique que pour les éléments de type inline et pas de type block comme c'est le cas pour les div.

Quelle version de IE utilises-tu ?

**Candygirl** · 24/09/2013, 14h47

Hello, lors de tes essais, as-tu bien pensé à renseigner correctement le doctype ?

**thecatz** · 24/09/2013, 14h57

En faite, j'utilise ici IE 9 , pour le doctype j'ai mis ça :

Code html :

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

1
2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml">

En fait pour le doctype j'ai un peut tout essayé mais sans succès

**Candygirl** · 24/09/2013, 15h01

Sur IE, tu appuies sur F12, la fenêtre de développement apparaît.
Quel mode de navigateur et de document est-il inscrit sur le haut droite de la fenêtre ?

Display inline block avec IE

CSS

Vue hybride

Discussions similaires

Partager

Partager