CSS3 et HTML5 boilerplate (débutant)

Bonjour à tous,

Je suis débutant en HTML et CSS et je dois utiliser le HTML5 boilerplate afin de recréer la mise en forme d'une page existante. On m'a fournit tous les éléments nécessaires ( css déjà construit les différentes images)
En regardant le code de index.html du boilerplate il est indiqué que la feuille de style par défaut est style.css situé dans le dossier css.

Le fichier style.css contient déjà des mises en forme. Je n'y ai pas touché car si c'est livré avec ses mises en formes c'est quelles sont nécessaires. Par contre je voudrais inclure mes propres feuilles de style tout en utilisant le boilerplate.

Vu que la page index.html à comme lien la feuille de style par défaut du boilerplate j'ai rajouté le contenu de mes différentes feuilles de style après le commentaire

/* Primary Styles
Author:
*/

Le problème c'est que le résultat que j'obtiens n'est pas identique à la page par défaut que je dois recréer via le boilerplate. Je n'ai pas modifié les feuilles de style qui m'ont été donnée puisque je suis à 100% que ce sont celle-ci qu'il faut pour obtenir les bons positionnements. Les différences réside dans la taille de la police des paragraphes, le placement d'une ligne qui devrait être au milieu mais est à gauche et le div qui contient la page n'est pas de taille identique ( il devrait y avoir des marges à gauche du texte plus importante il me semble).

Du coup j'ai indiqué dans le index.html le lien vers les feuilles de styles en question et remettant le fichier style.css tel qu'il est par défaut mais la je n'ai aucune mise en forme.

Y-a-t-il un élément qui m'aurait échapper avec le boilerplate pour l'utiliser tout en ayant sa propre mise en forme? Que j'utilise ou non le boilerplate en indiquant les liens de mes css j'aurais du avoir le bon rendu puisque l'on m'a fournit les éléments déjà fait pour recréer cette page ....

J'ai bien conscience que ma question peut paraitre bête mais je ne comprends pas trop.

En vous remerciant par avance de vos réponses.
Modifié par ApprentiDev (23 Jan 2011 - 11:04)

Salut,
Je ne l'ai pas utilisé mais je dirais qu'utiliser ce genre de fichier tout fait c'est bien à condition de comprendre les modifications que l'on y apporte... Sinon c'est le bug

Le problème ici c'est que les styles que tu as spécifiés ne prennent pas forcément le dessus sur ceux déjà établis du boilerplate. Les styles du boilerplate ne sont pas "obligatoires" et ils peuvent aller à l'encontre de la mise en page que tu souhaites recréer.

Autre chose à savoir, ce sont les dernières css appelées/lues qui seront prises en compte donc tu dois appeler tes propres feuilles de styles après le fichier css du boilerplate (et encore la question des priorités en css est bien plus vaste que ça, donc certains styles pourront ne pas être appliqués malgré leur ordre d'appel).

Et si tu n'a plus aucune mise en forme après tes bidouillages c'est que tu as du faire une erreur quelque part (tu n'aurais pas retirer la ligne qui appelle le fichier style.css ou modifé son nom ou son chemin accidentellement ?).

Essaie de tout reprendre depuis le début sans trop toucher au css boilerplate et en rajoutant tes propres règles après pour avoir un minimum d'interférence indésirables. Mais le mieux serait d'essayer d'apprendre un peu comment fonctionnent les css pour être en mesure de comprendre les modifications que tu apportes au fichier css. Bon courage !

J'ai trouvé. En fait c'était tout bête. J'avais deux fichiers qui portaient le même nom mais situé à des endroits différents. C'est en utilisant firebug que j'ai vu que les styles css n'était pas appliqué.

J'ai ensuite du faire quelques modifications à cause du css de base de boilerplate mais ça fonctionne.

Désolé du dérangement.