LessCSS incompatible avec IE6 et +

Chok71

1 Mar 2011 à 21:54

Bonjour,

J'ai récemment essayé le framework LessCSS (http://lesscss.org/) et j'ai remarqué qu'il ne fonctionne pas sur IE6 et plus, alors que sur le site il est écrit qu'il est justement compatible avec IE. Pire, le site officiel n'est lui même pas compatible avec les versions d'IE : http://img827.imageshack.us/i/pressepapiers1d.jpg/

Voici mon code complet :

HTML :


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

	<title>Test de LessCSS</title>

<link rel="stylesheet/less" type="text/css" href="style.less">
<script src="less-1.0.41.min.js" type="text/javascript"></script>

</head>
<body>

<div class="test"> TEST TEST TEST TEST TEST TEST TEST</div>
<div id="test2">
	<h2>
		<blockquote>
			TEST TEST TEST TEST TEST <span>TEST</span> TEST TEST TEST TEST
		</blockquote>
	</h2>
</div>

<a href="test">test<a/>

</body>
</html>

Ne vous fiez pas à la sémantique, j'ai fais exprès de faire du n'importe quoi.

CSS :


.test {
	color: red;
}

@color : blue;

.test {
	color: @color;
}

.border {
	border: 2px solid blue;
	display: block;
}

.test {
	color: @color;
	.border;
}

@value : 5px;

#test2 {
	background: orange;
	h2 {
		color: red;
	}
	h2 {
		blockquote {
			border-left: @value + 50 solid green;
			span {
				border: 3px solid black;
			}
		}
	}
}

.bundle {
  .button {
    display: block;
    border: 1px solid black;
    background-color: grey;
    &:hover { background-color: white }
  }
}

a {
	color: red;
	.bundle > .button;
}

Une idée ?

Merci.
Modifié par Chok71 (01 Mar 2011 - 21:56)

CSS et mise en forme, CSS3

LessCSS incompatible avec IE6 et +