Discussion :

[Palsajicoco]

Salut,

Je veux faire une ligne horizontale avec un style bien défini. J'arrive a déclarer le style, mais j'aimerai bien le déclarer comme une classe mais pas directement dans mon code, c'est a dire passe de :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<hr style="height:0.01em;width:90em;border:2px solid #000;" />

a quelque chose comme:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<horLi class="horizontalLine"><hr/></horLi>;

avec :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
horLi.horizontalLine{
height:0.01em;
width:90em;
border:2px solid #000;
}

La méthode hard-code marche mais l'autre non je ne sais pas pourquoi! J’espère avoir une solution, Merci d'avance.

[Nesmontou]

Bonjour,

A quoi correspond l'élément <horLi /> ?

Pourquoi ne pas mettre la classe directement sur l'élémént <hr /> ?

[Palsajicoco]

Merci pour la réponse,

J'ai crée un autre fichier .css pour y mettre tous mes classes css, donc si je remet cette directement je devrai rien changer en gros!

horLi c'est le secteur de balise définit ci dessous.

[Ceddoc]

Soit je ne connais pas du tout cette façon de faire (de l'html 5 peut être?) soit tu inventes des choses...

En tous cas pourquoi tu ne fais pas quelque chose de genre:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<hr class="horizontalLine" />

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
hr.horizontalLine{
height:0.01em;
width:90em;
border:2px solid #000;
}

Ce qui appliquerait ce style à toutes les balises hr ayant pour class horizontalLine

ou quelque chose comme ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<div id="lecontenantdeteshr"><hr/>
<hr/><div>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
#lecontenantdeteshr hr{
height:0.01em;
width:90em;
border:2px solid #000;
}

Ce qui appliquerait le style à toutes les balises hr situées dans le contenant...

[Bovino]

Soit je ne connais pas du tout cette façon de faire (de l'html 5 peut être?) soit tu inventes des choses...

Ce serait plutôt la seconde option !

[Palsajicoco]

Enfait, j'etais un peu confu j'ai déjà essayé ça et ça n'a pas marché! et ça ne marche toujours pas, pourtant la classe table marche très bien ..

[Ceddoc]

<table> est une balise html existante c'est sûrement pour ça qu'elle a marché, elle a du agir comme conteneur ce qui explique que ça ai marché mais je doute que ça soit très propre.

Tu devrais relire les cours sur le html/css

[polymorphisme]

Bonjour,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<div id="lecontenantdeteshr"><hr/>
<hr/><div>

Ce qui appliquerait le style à toutes les balises hr situées dans le contenant...

Un élément avec l'attribut id est censé être utiliser qu'une seule fois dans le document.

Une classe est plus appropriée à partir du moment où ton document contient au moins deux élements hr.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<hr class="horizontalLine" />

Enfin étant donner que généralement, un document ne contient pas une multitude d'éléments hr, en alternative aux classes, tu peux peut-être utiliser un sélecteur CSS moins général.

[Ceddoc]

Bonjour,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<div id="lecontenantdeteshr"><hr/>
<hr/><div>

Un élément avec l'attribut id est censé être utiliser qu'une seule fois dans le document.

Une classe est plus appropriée à partir du moment où ton document contient au moins deux élements hr.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<hr class="horizontalLine" />

Enfin étant donner que généralement, un document ne contient pas une multitude d'éléments hr, en alternative aux classes, tu peux peut-être utiliser un sélecteur CSS moins général.

Oui pour l'id je suis d'accord mais dans mon esprit le div id="lecontenantdeTEShr" contenait toutes les hr un peu comme ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<div id="lecontenantdeteshr">
<hr/>
 
blablabala
 
<hr/>
<div>

Dans ce cas là c'est bon non?