Tutoriel "Gabarits HTML et CSS simples"

Bonjour à tous

J'ai essayé le gabarit 07 qui est proposé dans ce tutoriel (indiqué en titre) en procédant de la manière suivante :

1) Recopie sur mon PC du fichier HTML de la page de présentation "... modele07.html" du site Alsacréations, en utilisant la fonction "code source de la page" de mon navigateur

2) Recopie sur mon PC des deux fichiers modele.css et base07.css indiqués

Et, alors que la page de présentation du site Alsacréations sort parfaitement bien avec mon navigateur (je suis sur PC / Vista / Firefox), celle que j'ai enregistré sur mon PC semble présenter deux défauts :

1) Les caractères accentué ne s'affichent pas, il faut que je remplace le jeu de caractères charset=UTF-8 par charset=iso-8859-1. Ce point ne me gêne pas puisque j'ai pu le corriger mais je trouve curieux que le jeu UTF-8 fonctionne dans un cas et pas dans l'autre. Pourquoi ?

2) La colonne de gauche (navigation) qui devrait faire la même hauteur que celle de droite ne fait que la hauteur juste nécessaire à l'affichage du texte qui est dedans.

Je ne vois pas comment corriger le problème N° 2. J'ai fait le même essai sur plusieurs autres gabarit et c'est pareil.

Pourriez-vous m'aider SVP ?

Merci davance, Pierre

Bonjour,

1/base.css et modele07.css
Cela vient peut-être de ton éditeur et de ses paramètres d'enregistrement ? Difficile de t'en dire plus, sans plus d'informations (Navigateur utilisé pour visualiser/enregistrer les sources, nom de ton éditeur de code, page en ligne,...)

2/Il peut sans doute être intéressant de lire les explications aimablement fournies par le nom moins aimable auteur de ces gabarits...

Florent V. a écrit :
Ce gabarit utilise la technique des colonnes factices pour afficher deux colonnes de même hauteur quelle que soit la hauteur des contenus. On utilise donc une image de fond (07-colonnes.png), répétée en hauteur et appliquée au conteneur div#centre.

L'image en question

Faire une recherche sur les termes "colonnes factices" et éventuellement sur les soucis d'encodage.

Cdt,
Sylvain

Merci Sylvain, ca marche super pour le point (2) j'ai mis l'image et c'est nickel. Je ne suis pas encore très calé mais ca va venir petit à petit :o)

Pour le point (1) j'utilise uniquement Firefox et Notepad++.

Cordialement, Pierre

Pierrot92320 a écrit :

Merci Sylvain, ca marche super pour le point (2) j'ai mis l'image et c'est nickel. Je ne suis pas encore très calé mais ca va venir petit à petit :o)
Pour le point (1) j'utilise uniquement Firefox et Notepad++.
Cordialement, Pierre

Il faut, notamment lorsque l'on débute, mais en règle générale, prendre le temps de lire les tutoriels et de se documenter sur les points que l'on ne connait pas.
Ravi que cela fonctionne, et que tu aies maintenant pris connaissance de ce que sont les colonnes factices

Concernant notepad++, je t'encourage à lire la doc et à parcourir les différents forums qui traitent du sujet.(sinon cela se passe sans doute du coté de : Format -> Encoder en UTF-8 (sans BOM) ou Convertir UTF-8 (sans BOM) au moment d'enregistrer ta page (x)html, à vérifier )

Cdt,
Sylvain

a écrit :
Concernant notepad++, je t'encourage à lire la doc et à parcourir les différents forums qui traitent du sujet.(sinon cela se passe sans doute du coté de : Format -> Encoder en UTF-8 (sans BOM) ou Convertir UTF-8 (sans BOM) au moment d'enregistrer ta page (x)html, à vérifier )

Je vais regarder cela je te remercie encore. Je lis la doc et les tutoriels, j'ai aussi acheter 3 livres (HTML, CSS et JAVA), je dois aussi apprendre à maîtriser un peu GIMP et Euclide ... Ca fait beaucoup mais j'avance

Cordialement, Pierre