28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Dans le cadre de mon stage je dois développer un site qui doit être en HTML5, responsive mais aussi compatible tous navigateurs... J'utilise Bootstrap, avec par dessus mes propres feuilles de style se chargeant en fonction de la résolution (par exemple :
<link rel="stylesheet" type="text/css"  media="screen and (min-width: 992px) and (max-width: 1200px)" href="../style/medium.css">


Jusque là aucun souci, j'ai terminé ma page-type qui s'adapte bien aux changements de largeur, et en testant en local sous Chrome c'est niquel, sous Firefox pareil, mais sur la version d'IE que j'ai à disposition (la 8)... au secours @_@

IE 8 ne charge tout simplement pas mes feuilles persos ni celles de Bootstrap. J'ai d'ailleurs testé en ligne sur un autre site que j'avais développé de la même manière, le problème se répète...

Je suis hyper embêtée Smiley bawling
J'ai pourtant bien ces lignes là :

<!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->


Elles ne sont pas sur l'autre site que j'ai testé en ligne cependant, je viens de le remarquer...
Mais je me dis que même si elles fonctionnaient, j'aurais donc un affichage de la grille Bootstrap correct, mais qu'en est-il du problème avec mes propres feuilles de style?

Comment faire d'après vous ?
Y'a t-il un moyen de réussir à charger les feuilles bootstrap mais aussi les miennes sous IE 8 ?

Sinon je vais bloquer sur ce point et ça craint pour le respect du cahier des charges...

Merci d'avance ! Si je dois poster des bouts de code supplémentaires dites-le moi o:
Modifié par lumya (11 Apr 2014 - 11:53)
J'ai hébergé temporairement ma page sur le net et il semblerait que ça fonctionne finalement !
La seule chose que j'ai modifié avant cela (du coup je ne sais pas si ça a joué, mais pour ceux qui passeraient par là avec le même souci sait-on jamais) c'est d'ajouter dans mes feuilles de style des media queries qui englobent tout, par exemple :
@media screen and (min-width: 768px) and (max-width: 992px) { tout le css ici }


Comme IE 8 ne semblait pas prendre en compte les indications de dimensions des balises meta, je pense que ces media queries ont joué; et en fait, le script "respond.js" (en rouge dans mon post précédent)ne fonctionne apparemment pas en local. Il permet à IE d'interpréter correctement les media queries si j'ai bien compris; ça règle donc le souci pour le CSS de bootstrap mais aussi pour mes feuilles persos !

Si c'est correct, j'espère avoir aidé d'autres personnes au passage Smiley cligne