Discussion :

[mademoizel]

Bonjour à tous,

Je réalise un site, et je souhaite séparer mon menu, mon en-tête ainsi que ma page centrale par des lignes de séparations.
Je souhaiterai personaliser ces lignes et je souhaite savoir s'il est possible de le faire avec CSS?

Merci d'avance pour vos réponses.

[cedsun]

oui c'est possible.

Tu peux faire des tests avec <hr/>.

[mademoizel]

excuse moi, mais je vois pas trop comment faire.

Je sais bien qu'un hr constitue à faire une ligne de séparation, mais comment le personnalisé avec du css?

[mLk92]

comme tout autre propriété se rapportant à une balise html

Code :

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

1
2
3
4
 
hr{
 color: black;
}

après si tu veux personalisé barre par barre tu peut y mettre une classe

[mademoizel]

Merci beaucoup. Je vais essayer

[mademoizel]

J'ai une autre question. Est-il possible de faire une de séparation mais en verticale?

Merci d'avance pour vos réponses

[tigunn]

tu peux aussi utiliser une image (taille = just_les_pixel_qui_faut x 1px):
-tu definit une div avec cette image en fond répété horizontalement ou verticalement.
- position en absolute et un z-index pour peaufiner, là, ....

ma que c'est beau.
exemple:

Code :

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

1
2
3
4
5
6
7
8
9
10
div#page #bordure_externe_droite
{
	position : absolute;
	margin: 0;
	width: 4px;
	height: 98%;
	right: 0px;
	background: url(images/container-bg.gif) repeat-y;
	z-index: 1;
}

et puis dans ton code php, juste:

Code :

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

1
2
3
<div id="bordure_externe_droite">
			<!-- bord droit de la page -->
		</div>

positionné dans div id="page".
bondev'