Un problème d'alignement - Débutant

21 mai 2006, 13:17

Bonjour! Je suis un débutant pur en CSS.
J'ai défini cette balise:

cde1{font-family: Old English Text MT; font-size:1em; color: ff0000; text-decoration: underline; text-align: center;}

Tout fonctionne sauf l'alignement au centre (dernier paramètre). Le problème ne vient pas du point-virgule, j'ai essayé sans également.
Quelqu'un peut me dire où j'ai fait une erreur?

21 mai 2006, 13:25

Alors il faut corriger une première erreur :
le choix de la police de caractère comporte des espaces, il faut donc utiliser des guillemets :

Code : Tout sélectionner

cde1 {
	font-family: "Old English Text MT"; 
	font-size: 1em; 
	color: ff0000; 
	text-decoration: underline; 
	text-align: center;
}

Ensuite pour te répondre, "cde1" n'est pas une balise HTML : je soupçonne qu'il s'agit de la valeur d'un attribut : soit "id" soit "class" :
Dans le cas où c'est id, tu dois alors écrire dans ton CSS #cde1 (préfixé par un diese);
Dans le cas où c'est class tu dois écrire : .cde1 (préfixé par un point).

21 mai 2006, 13:57

Merci pour ta réponse.
Pour les balises, je croyais qu'on pouvait créer ses propres balises avec le CSS. C'est ce que j'ai fait (j'essaie pour comprendre), et ça marche sauf pour l'alignement au centre. L'esapce dans les noms ne change rien pour moi (ou alors j'ai loupé quelque chose).

Pour un 2e essai, j'ai fait ceci dans ma feuille de css:

#titre1{font-family: Old English Text MT; font-size:2em; color: ff0000; text-decoration: underline; text-align: center}
#titre2{font-family: Arial; font-size:1em; color: 000000; text-decoration: none; text-align: center}

Et ceci dans ma page html:

<html>
<head>
<title>Essai</title>
<link rel="stylesheet" type="text/css" media="screen"  href="styles.css" />
</head>
<body>
<div id="titre1">J'écris titre</div>
<div id="titre2">J'écris autre chose</div>
</body>
</html>

Ca j'ai bien compris, mais je voudrais revenir au système de balises. Puis-je construire mes propres balises?

21 mai 2006, 14:16

Non, les balises sont fixées dans la DTD (Document Type Definition) du langage HTML ou XHTML.

Avec XHTML2 on pourra créer ses propres balises, mais d'ici là, on doit utiliser celles existantes.

Le principe, c'est de pointer sur un élément précis dans la page. En utilisant un attribut id, c'est ce qu'on obtient.

Les guillemets pour encadrer le nom de la police de caractère dans la feuille de style sont également obligatoires, c'est le Standard CSS.

Donc pour résumer, voici ton code fonctionnel (j'ai mis le style directement dans la page pour simplifier, ça marchera de la même manière avec la feuille externe):

Code : Tout sélectionner

<html>
<head>
<title>Essai</title>
<!-- 
<link rel="stylesheet" type="text/css" media="screen"  href="styles.css" />
 -->
<style type="text/css">
#titre1{
    font-family: "Old English Text MT"; 
    font-size: 2em; 
    color: ff0000; 
    text-decoration: underline; 
    text-align: center;
}
#titre2{
    font-family: Arial; 
    font-size: 1em; 
    color: 000000; 
    text-decoration: none; 
    text-align: center;
}
</style>
</head>
<body>
<div id="titre1">J'écris titre</div>
<div id="titre2">J'écris autre chose</div>
</body>
</html>

À propos de la police de caractères, attention à un détail très important. Ton choix de police n'est pas judicieux: il ne fonctionnera en effet qu'avec les internautes qui auront cette police précise dinstallée dans leur machine : tu peux donc à priori exclure les ordinateurs Apple sous Mac et les PC sous Linux. Il est donc toujours vivement recommandé de mettre des polices alternatives. Par exemple, tu mets la police de préférence, suivie d'une police alternative et enfin d'une famille générique. Pour la police alternative, on va souvent utiliser une police Linux. Les familles de police sont les serif et les sans-serif

Ce qui donne dans la feuille de style:

Code : Tout sélectionner

#element {
    font-family: "police premier choix", "police alternative", sans-serif;
}

21 mai 2006, 22:50

Ok merci pour les renseignements sur la police. Je sais que la police que j'utilise est rare, mais ce n'était pas le but de ce topic. D'ailleurs avec un graphiste, on va en créer une qui nous est propre et la proposer en téléchargement sur notre site, elle fera partie du graphisme.

01 juin 2006, 11:44

On peut créer des balises perso avec leurs propres styles mais les navigateurs les concidèrent comme des balises XML
La question de centrer le texte n'est pas possible car une balise perso n'est pas concidérée comme un conteneur pouvant avoir une largeur précise. Sachant que pour centrer le texte il faut que son conteneur (la balise) soit plus large.

Cyrano l'a bien signalé, il s'agit d'une DTD une balise perso de type XML qui n'est qu'un porteur de données.

Un problème d'alignement - Débutant

Qui est en ligne