Discussion :

[Eléonore23]

Bonjour,
Connaissez-vous un moyen pour écrire sur une bordure avec du CSS ?
Merci d’avance pour votre aide.

[devyan]

Bonjour,

Je ne demande pas souvent le pourquoi mais là cela me semble nécessaire

Si c'est pour "simuler" un framesetfieldset, autant utiliser un framesetfieldset

devyan

[eckerdecker]

Une explication plus en détails est, je pense, nécessaire

[Eléonore23]

Désolé pour ma demande peu clair. Je m’explique :
On me demande de reproduire une interface à l’identique grâce au CSS.
Voici ci joint un exemple de cadre que je dois reproduire (il contiendra divers boutonspar la suite). : image.doc
Comment écrire "mode" et le placer là où il est sur l'image ?

[eckerdecker]

Avec l'aide des attributs css position et top, voici un exemple à adapter à ton besoin :
HTML

Code :

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

1
2
3
4
5
<div class="bloc">
	<h1>
		<span>Titre</span>
	</h1>
</div>

CSS

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
.bloc {
	width:300px; height:300px;
	border:1px solid black;
}
.bloc h1 {
	margin:0;
	text-align:center;
	font-size:13px;
	position:relative;
	top:-5px;
}
.bloc h1 span {
	background:#fff;
	padding:0 5px;
}

[Eléonore23]

C'est exactement ça.

Je te remercie pour ton aide.

[tsunamichups]

Tu peu utiliser des image de fond pour le faire
une en haut
une au milieu
une en bas

Code :

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

1
2
3
4
5
6
 
<div id="haut"></div>
<div id="milieu">
contenu
</div>
<div id="bas"></div>

et le css

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
#haut
{
width:300px;
height:20px;
background-image:url("image_haut.png");
background-repeat:no-repeat;
}
 
#bas
{
width:300px;
height:20px;
background-image:url("image_bas.png");
background-repeat:no-repeat;
}
 
#milieu
{
width:300px;
height:auto;
background-image:url("image_milieu.png");
background-repeat:repeat-y;
}