28221 sujets

CSS et mise en forme, CSS3

Je viens de tester à mes dépends que IE ne peut aller plus loin que h6, contrairement à firefox qui peut lui en plus supporter la création de balise de type <essai></essai>

A moins que la fatigue du soir me dise bonsoir, mais sinon, je crois bien que c'est la dure réalité.

Vous avez une idée, dans ce cas, pour réaliser d'autres titres, lorsque les 6 premieres balises h sont utilisées ?

(on notera que j'ai une estime à la chute vertigineuse et irreversible depuis que je touche au css pour ce navigateur Smiley fache )
Modifié le 27 Jan 2005 - 13:09
Bien oui, il suffit TOUT simplement de déclarer dans le css la balise, comme ceci :

essai {
	font-size: 11px;
	text-align:center;
	padding: 1px;
	background-color: #5496CB;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: white;
	margin: 0px;
	width: 100px;
}


et de mettre simplement ensuite en html :

<essai>Un essai</essai>


C'est PARFAITEMENT supporté par Mozilla.
Je ne sais pas encore si c'est régulier de le faire, j'aimerais à ce propos l'avis d'un expert, mais en tous cas, ça peut s'avérer TRES utile.

Franchement, je commence à avoir de gros boutons rouges quand je pense à IE... Qqn a-t'il une idée pour remédier à la chose avec lui ?
Modifié le 27 Jan 2005 - 01:42
@Wildry, il va falloir te mettre au xml !
http://www.w3.org/TR/2004/REC-xml-20040204/

Extensible Markup Language (XML) 1.0 (Third Edition) a écrit :

<?xml version="1.0"?>
<greeting>Hello, world!</greeting>

Ça fonctionne en effet, mais je ne crois pas que ce soit dans html 4.01 et je ne pense pas que XHTML 2 ait prévu de l'implémenter ! Smiley cligne
http://www.w3.org/TR/xhtml2/elements.html

Autre exemple avec une DTD greeting SYSTEM!
a écrit :

<?xml version="1.0"?>
<!DOCTYPE greeting SYSTEM "hello.dtd">
<greeting>Hello, world!</greeting>

Modifié le 27 Jan 2005 - 02:14
Wildry a écrit :
Bien oui, il suffit TOUT simplement de déclarer dans le css la balise, comme ceci :

essai {
	font-size: 11px;
	text-align:center;
	padding: 1px;
	background-color: #5496CB;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: white;
	margin: 0px;
	width: 100px;
}


et de mettre simplement ensuite en html :

<essai>Un essai</essai>


C'est PARFAITEMENT supporté par Mozilla.
Je ne sais pas encore si c'est régulier de le faire, j'aimerais à ce propos l'avis d'un expert, mais en tous cas, ça peut s'avérer TRES utile.

Franchement, je commence à avoir de gros boutons rouges quand je pense à IE... Qqn a-t'il une idée pour remédier à la chose avec lui ?


C'est quoi le rapport entre les 6 niveaux de titre et le bidouillage avec essai? Pour une fois je serais d'accord avec IE de ne pas interpréter <essai>, j'avoue que le côté "très utile" de ton raisonnement me laisse perplexe, cet <essai> a t-il un sens en lui-même, pour les agents utilisateurs qui l'utilise ?
J'imagine que tu fait des pages comme du html et pas du xml, alors même si c'est supporté par tel ou tel navigateur il ne me semble pas opportun de multiplier ce type d'expériences. Tu devrais nous exposer ce que tu souhaites faire avec tes niveaux de titre et nous présenter un exemple, cela serait plus simple.

ps: pas besoin de CRIER, je ne suis pas sourd Smiley cligne
Modifié le 27 Jan 2005 - 02:01
Aïe Aïe Aïe !

Tout d'abord, Firefox ne supporte pas du tout mieux qu'IE ce que tu essaie de faire: ton document étant en fait, quelque-soit son éventuel doctype, du HTML erroné, le navigateur est libre d'agir à sa guise face à ce qui n'est qu'une erreur de balisage : HTML ne définit pas de règles de traitement d'erreur. Il se trouve que :
- certains navigateurs tentent de rectifier ton erreur en générant une boîte permettant de styler ton élément (Firefox).
- d'autres se contentent d'afficher le contenu textuel de ton pseudo-élément en ignorant ce pseudo-balisage (IE).

Aucun n'a tort ni raison puisqu'il n'existe pas de règle Smiley cligne

Ensuite, ton <essai> n'est pas un niveau supplémentaire de titrage. Ce n'est qu'un contenu brut, car <essai> n'existe pas, n'étant pas défini par une DTD.

Enfin, tu tombes dans un travers connu : créer une pseudo-structure dénuée de signification, inexploitable sauf pour obtenir une présentation. Autrement dit :
- le seul résultat est purement visuel et dépend de CSS.
- cela n'a pas de sens pour un moteur de recherche ou tout autre machine susceptible d'exploiter ta page. Par exemple, ton <essai> ne sera pas pris en compte par un script extrayant les titres de ton document pour constituer une table des matières. Il sera ignoré dans les navigateurs offrant un mode de navigation de titre en titre, etc.

Il faut bien comprendre que CSS ne sert qu'à mettre en forme une structure existante. Il ne permet pas d'en créer.

Wildry a écrit :
Vous avez une idée, dans ce cas, pour réaliser d'autres titres, lorsque les 6 premieres balises h sont utilisées ?
Smiley fache )


S'il n'existe que 6 niveau de titres, il me semble qu'aller plus loin reviendrait à atomiser inutilement le contenu.

Au pire, si tu tiens absolument à générer quelque-chose de ce type, tu peux utiliser un élément existant, fait pour ça : <div>. Ce ne sera toujours pas un élément de titre, mais au moins, ton balisage sera pris en compte à coup sûr pour la présentation, tout en étant valide.
Modifié le 27 Jan 2005 - 07:16
@Stephan, merci de l'info. je vais tenter de faire une ou 2 choses qui me libèreront mes balises de titre. A ce propos, ce sont les seuls balises que j'ai utilisé dans un but décoratif, mais je comprends aussi que ce ne soit pas forcement utile maintenant. Seulement, sans dire que j'ai raison, ni tord, je trouve que le balisage créatif peut etre tres sympa. Dans mon exemple, je parle de "titres", ce qui n'est pas très utile par contre, je le concois. Mais dans le cas de balise type <code>, <expression> ou autre, on peut se faire déjà une meilleure idée de ce que je voudrais. (c'est sur qu'"essai" ne parle pas trop)

Bon, donc faut que je me mette aussi au xml, si je veux créer des balises ? Ca n'a pas l'air tres facile, avec ce que tu m'as donné comme lien.
J'ai donc pas fini de vous emebéter Smiley langue (mais c'est de votre faute aussi, vous le chercher Smiley lol )
Ah oui, merci beaucoup pour ce lien magique. Il fait et fera désormais parti de mes signets Smiley smile

Sinon, j'ai réglé mon histoire en remplacant mes titres h par des divs. Je ne pense pas qu'il y ait d'autres solutions, car je veux faire un site tres graphique, vu son contexte (le jeu vidéo). Le site peut ne pas être forcement accessible pour les aveugles (malheureusement), mais si je peux respecter un peu plus les normes, ce sera pas pluis mal, et ça m'apprend en plus à mieux coder. Pour l'instant, j'ai même pas un seul tableau, et ça m'étonne de moi-même.
Modérateur
Pourquoi as-tu besoin d'autant de titres ? N'oublis pas que rien ne t'empêche d'utiliser plusieurs fois un h2, un h3 etc... Ils ne doivent pas forcément être unique dans un document. Je suis étonné que tu as besoin de plus de 6 niveaux de titre, parce que h6 ne veut pas dire 6e titre, mais bien titre de 6e niveau. Tu comprends la nuance ?

À ta place, je présenterais ta page telle que tu l'as conçu, pour que nous puissions t'indiquer quelles balises seraient préférables.
En ce qui me concerne, les titres de niveaux <h1> à <h4> sont largement suffisants. À partir de <h5>, la taille par défaut du titre tend à passer sous la taille d'un simple <p>, ce qui n'est pas souhaitable dans la majorité des cas lorsque CSS est désactivé.

Et je ne crois pas que le but d'XML est de créer un balisage fantaisiste...
Modifié le 27 Jan 2005 - 21:13
oki j'ai bien saisi la nuance. Pour la comprendre, il faut se mettre dans la peau d'un site sans "skin". Après, on fini par déduire effectivement l'utilité des balises prédéfinies.

Ah mon site actuellement est en pleine préparation, ya pas de php ou juste minime de mis en place, et aucun lien de bdd. il est à cette adresse : http://www.gplays.com/V4/ Voilà, où j'en suis, et entièrement en css (aie pas taper si ya des betises, j'apprends, et je corrige doucement les erreur de validité css. enfin corrigez-moi si vous voyez des probs Smiley smile

Par contre, @Merkel, tu parles de reprendre plusieurs fois les mêmes balises h (ex. h1), avec des differences eventuelles.

Peux-tu me dire si cet exemple correspond à ce que tu veux me dire ? par contre, je n'ai pas encore essayé, donc je vais surement écrire une bétise, mais au moins on avancera comme ça Smiley smile Corrigez-moi si je me trompe !


#balise1 {
...
}
#balise1 h1 {
color: blue;
}
#balise2 {
...
}
#balise2 h1 {
color: black;
}


Ca marche ça ? Je sais qu'on peut, et c'est ce que je fais, changer pour "a", "p" etc mais pour h1, j'ai jamais tenté.
Moi, j'utilise un seul <h1> dans une page et généralement un seul <h2>.

Ensuite, quelques <h3><h4>, <h3><h4>, etc...

Exemple :

<h1 id="head">Crapule.com</h1>
<h2 id="subhead">Le site officiel des gens aux mœurs malhonnêtes</h2>

<h3 class="sujet">Devenez millionnaire en 3 jours</h3>
<h4 class="date">2005-01-24</h4>
<p>bla bla bla</p>

<h3 class="titre">Profitez de cette offre limitée</h3>
<h4 class="auteur">Par : Maximus Hypocrytus</h4>
<p>bla bla bla</p>
oki, je vois, mais donc dans ce cas on peut bien ecrire en css :

.sujet h3 {
        color: black;
}

non ?
Ca parait logique, mais comme je n'ai toujours pas essayé, j'en profite donc pour me poser cette question ^^
Wildry a écrit :

Ca parait logique, mais comme je n'ai toujours pas essayé, j'en profite donc pour me poser cette question ^^

Tu pourrais peut-être essayer avant de poser des questions ? Smiley cligne