Discussion :

[auduma]

Bonjour, petite question simple:

Je dois faire un espace en html de environs 15 caractères.
Comment faire? Actuellement je fais :

Code :

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

       

mais c'est pas top! :-(

Comment puis-je faire une tabulation, par exemple?

Merci d'avance!

[blueice]

On doit faire ca avec une feuille de style

et tu joues sur les espaces, margin et padding selon le cas...

[Maxoo]

en CSS, avec un

Code :

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

margin-left: 30px;

un truc comme ca, et tu spécifie la taille en fonction de tes besoins.

[auduma]

Il n'y a pas de code plus simple?? car l'espace que je dois faire c'est entre deux chaines de caracteres !! mais bon je vais utiliser les CSS si il n'y a que ca!

Mais si vous trouver d'autres solutions...

[SIBELIUS]

Il n'y a pas de code plus simple?? car l'espace que je dois faire c'est entre deux chaines de caracteres !!

C'est plutot simple en fait.

Voici un exemple :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
.marge {
margin-left: 5em;
}
 
 
<p>
   Un début de texte
   <span class="marge">un texte plus loin (espace de 5 caractères)</span>
   <span class="marge">un texte encore plus loin</span>
</p>

Mais si vous trouver d'autres solutions...

Les CSS sont fait pour ça, autant utiliser les outils appropriés, non ?

[auduma]

Super, ca marche très bien et c'est vrai que c'est simple et plus joli que

Code :

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

   

[edouard.danaradjou]

Bonjour,

Tu peux également utiliser la balise HTML <dd> qui effectue un décrochage sur la droite.

Code :

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

1
2
 
<dd>Retrait à droite suite dans une page html...

Have a nice day !

[ledisciple]

La balise <dd> est utilisé pour décrire un élément dans une liste de définition.

La balise <dd> est utilisé en conjonction avec <dl> (définit la liste de définitions) et <dt> (définit l'élément dans la liste).

Bref, il vaut mieux utiliser le css (qui ... heu .. sert à mettre en page ...) plutôt que de détourner des balises ...

[Willypiti]

Bonjour,

J'ai une autre solution pour remplacer une suite &nbsp pour faire des espaces. Ca reste du bricolage un peu dégueu mais c'est mieux que &nbsp et plus imple que les autres soluces à mon gout.

Code :

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

<FONT color="laCouleurDuFontDeVotrePage"> autant de caractères que d'espaces souhaités </FONT>

Ca va juste donc ecrire des lettres et les colorer en la couleur de font et donc les rendre invisibles et donc équivalentes à des espaces.

[thelvin]

Willypiti, c'est 100% dégueu, moins bien que &nbsp; qui est pourtant bien crade en soi, c'est impossible dès qu'on a pas un fond uni, c'est-à-dire presque toujours, et ça pourrit complètement les sélections de texte et les indexations, telles que les moteurs de recherche.

Bref, c'est à ne pas faire. Au pire du pire, &nbsp; est peu pratique mais n'a pas tous ces inconvénients.

[Willypiti]

Je suis tombé par hasard sur autre chose susceptible d'être une solution :

Code :

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

<pre>       </pre>

Cette balise permet de prendre en compte les espaces et donc les tabulations.

Faut-il aussi éviter d'utiliser cette solution?

[thelvin]

À tout prendre je la trouve préférable à nbsp, elle et ses semblables en whitespace: pre;

Mais <pre> garde le défaut pour les indexeurs de présenter une section préformattée, et whitespace: pre garde le défaut de s'appuyer sur la largeur d'un espace de la fonte et d'être peu clair et compliqué à maintenir.

C'est à éviter comparé à une technique qui sépare la structure du document, de sa présentation et les marges de cette présentation.

[rospionne]

Je reprend l'idée du span en le simplifiant :
au lieu décrire

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
#marge {
margin-left: 5em;
}
 
 
<p>
   Un début de texte
   <span class="marge">un texte plus loin (espace de 5 caractères)</span>
   <span class="marge">un texte encore plus loin</span>
</p>

on peut mettre

Code :

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

1
2
3
4
5
6
7
.marge {
margin-left: 5em;
}
 
<p>
  <span id='marge'/> Le mal est partout, notre funestre destin va partire, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc, etc
</p>

Tester le.

[thelvin]

Hello,

Tu as inversé la syntaxe du class et la syntaxe du id, donc si on teste, ça marche pas .
Mais l'idée est assez claire. Sauf que.

À part en XHTML application/xhtml+xml (une situation très rare), cette syntaxe n'est pas valide.
La notation balise autofermante <span/> n'existe pas en HTML non-XML. Elle est tolérée, mais ignorée. Tu as donc ouvert une balise <span> mais tu as oublié de la fermer.
Ça marche à l'affichage, parce que le navigateur compense cette bêtise quand il la détecte : il voit qu'on ferme la balise <p> avant qu'on ait fermé son enfant, la balise <span>, alors il la ferme d'abord. Ce qui fait que ta notation ressemble en fait pas mal à ce qui était déjà proposé, du point de vue du navigateur.

Ce que tu pensais aurait probablement été :

Code :

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

1
2
3
4
5
6
7
8
9
#marge {
margin-left: 5em;
}
 
<p>
   Un début de texte
   <span class="marge"></span>un texte plus loin (espace de 5 caractères)
   <span class="marge"></span>un texte encore plus loin
</p>

Ça marche, c'est un peu plus lourd, mais ça correspond un peu mieux à l'idée "et ici tu m'injectes une séparation dans le texte".