min-height non reconnue sous IE ?

**jncoffy** · 26/06/2007, 15h31

Bonjour à tous

J'ai un problème avec Internet Explorer qui ne reconnait pas la propriété min-height que j'ai attribué à une balise div dans ma feuille de style.

Voici le 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
16
17
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
   <META http-equiv="content-type" content="text/html; charset=ISO-8859-1" lang="fr" />
   <title></title>
   <link rel="StyleSheet" href="exemple1.css" type="text/css" />
</head>
<body>
 
  <div id="bas">
     <h1>Style Titre h1</h1>
     <p>Style paragraphe p</p>
  </div>
 
</body>
</html>

et le code 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
 
div
 {
     overflow:hidden;
 }
 
div#bas
 {
	margin-top: 0;
	clear: both;
	background-color: #5270d7;
	background-image: url(fond.jpg);
	background-repeat: no-repeat;
	background-position: left;
	min-height: 500px;
}

Je précise que sous Mozilla Firefox, tout se passe bien. D'ou vien le problème. IE ne reconnait t'il pas min-height ou ai-je fais une erreur de code ? Dans le cas ou il s'agit de la première réponse, existe t'il une solution pour aboutir au même résultat, à savoir une hauteur minimale de mon DIV de x pixels

Merci d'avance

**Strix** · 26/06/2007, 15h34

Salut.

J'ai une bien mauvaise nouvelle...

IE6 ne reconnait pas les min-xxxx au max-xxxx...

J'ai rencontré ce problème, j'ai créé une feuille CSS uniquement pour IE6

**Candygirl** · 26/06/2007, 15h49

Tu peux utiliser un hack pour IE6- afin de lui donner un height de 500px (qu'il va étirer comme si c'était un min-height

). Par exemple:

Code :

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

1
2
3
* html div#bas{
  height:500px;
}

Comme html n'a pas d'ancêtre tous les navigateurs ignorent cette instruction sauf IE6- qui le prend en compte. Cette syntaxe à l'avantage de passer la validation.

**Bisûnûrs** · 26/06/2007, 15h50

IE6 interprète le height comme un min-height.

Donc ce que tu peux faire c'est rajouter ça en-dessous de div#bas :

Code :

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

1
2
3
* html div#bas{
   height:500px;
}

La syntaxe * html n'est reconnue que par IE6.

**jncoffy** · 26/06/2007, 16h00

Ok, merci à vous 3.

J'ai donc modifié mon code CSS pour qu'il ressemble à ceci

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
 
*html div#bas
 {
 
	height:500px;
 }
 
div#bas
{
	margin-top: 0;
	clear: both;
	background-color: #5270d7;
	background-image: url(fond.jpg);
	background-repeat: no-repeat;
	background-position: left;
	min-height: 500px;
 
}

Et là, ça marche sous IE comme sous Firefox. Et ça s'étire bien si nécessaire

Décidément, il était trop simple de faire simple.En tout cas,merci pour vos lumières

Jean Noël

**Strix** · 26/06/2007, 16h06

Et y en a qui s'embête pour faire une feuille CSS

min-height non reconnue sous IE ?

CSS

Discussions similaires

Partager

Partager