# Html : mise en page de paragraphes et sous paragraphe (débutant)

**URL:** <https://www.debian-fr.org/t/html-mise-en-page-de-paragraphes-et-sous-paragraphe-debutant/87945>\
**Category:** Programmation\
**Created:** [Mars 3, 2023, 6:26 UTC](https://www.debian-fr.org/t/html-mise-en-page-de-paragraphes-et-sous-paragraphe-debutant/87945 "2023-03-03T18:26:39Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Crapot](https://www.debian-fr.org/user_avatar/www.debian-fr.org/crapot/32/14932_2.png) [@Crapot](https://www.debian-fr.org/u/Crapot)\
**Post date:** [Mars 3, 2023, 6:26 UTC](https://www.debian-fr.org/t/html-mise-en-page-de-paragraphes-et-sous-paragraphe-debutant/87945/1 "2023-03-03T18:26:39Z")

</div>

Bonsoir.

Excusez moi, c’est une simple question de mise en page via css pour un html que je n’arrive pas à trouver sur la toile. Je suis débutant et je ne m’en sort plus dans mes recherche.

C’est pour le retour à la liste d’un point d’une liste qu’il faudrait amener à ce qu’il se poste au niveau du début du texte et non pas de l’attribut du point. Ouaich charabia quoi … vais tenter …

Voici:  
Mon css indique sur une ligne ceci:

```css
.List {margin-left: 5em; margin-right: 6em; list-style-type: none;}

```

Mon html est comme suit:

```auto
<ul>
<li> "ATTRIBUS-DU-POINT-DE-LA-LISTE" : Définition plus ou moins longue de l'attribut cité juste précédement. <li>
<ul>

```

Ce que j’aimerais et n’arrive pas à faire et dieu sait que j’ai essayé plein de trucs différent:  
Que le retour à la ligne de la définition si il en existe du à la longueur de celle-ci, revienne non pas en dessous du «&nbsp;A…&nbsp;» de ATTRIBUS mais soit décalé sur la droite et se positionne en dessous du «&nbsp;D…&nbsp;» de définition.

J’ai pas su juste faire cela. ça ne doit pas être grand chose mais à mon avis je m’y prend mal…

Peut-on définir dans le css : une puce de liste qui correspondrait à une chaine de caractère définie dans le html ?  
(juste déjà avec ça je me suis éparpiller dans moulte nouvelles pseudo-solutions)

Mercii  
(ça fait juste des heures pour ce petit point juste esthétique 🙃 )

---

<div class="post-metadata">

**Author:** ![pam547](https://www.debian-fr.org/letter_avatar_proxy/v4/letter/p/f17d59/32.png) [@pam547](https://www.debian-fr.org/u/pam547)\
**Post date:** [Mars 3, 2023, 7:03 UTC](https://www.debian-fr.org/t/html-mise-en-page-de-paragraphes-et-sous-paragraphe-debutant/87945/2 "2023-03-03T19:03:22Z")

</div>

Salut,

La dernière Doc que j’ai lu sur le sujet était sur le css3,

Aujourd’hui ce serait du css4,

> **[CSS Reference](https://www.w3schools.com/cssref/index.php)**
>
> W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

Pour ce que vaut cette référence 🤨,

J’aurais tendance à tester align, text-ident et list-prop.

---

<div class="post-metadata">

**Author:** ![Crapot](https://www.debian-fr.org/user_avatar/www.debian-fr.org/crapot/32/14932_2.png) [@Crapot](https://www.debian-fr.org/u/Crapot)\
**Post date:** [Mars 3, 2023, 7:34 UTC](https://www.debian-fr.org/t/html-mise-en-page-de-paragraphes-et-sous-paragraphe-debutant/87945/3 "2023-03-03T19:34:34Z")

</div>

> [@pam547](#):
>
> J’aurais tendance à tester align, text-ident et list-prop.

Aaaah mais Ouiiii  
J’avais pas songé !! merci .. vais faire un tour de se coté. Mercii !!

---

<div class="post-metadata">

**Author:** ![Crapot](https://www.debian-fr.org/user_avatar/www.debian-fr.org/crapot/32/14932_2.png) [@Crapot](https://www.debian-fr.org/u/Crapot)\
**Post date:** [Mars 3, 2023, 8:41 UTC](https://www.debian-fr.org/t/html-mise-en-page-de-paragraphes-et-sous-paragraphe-debutant/87945/4 "2023-03-03T20:41:29Z")

</div>

Grave … je suis arrivé à faire un truc comme je le désirais  
faut voir si à terme ça tient la route.  
Voici le lien qui m’a aiguillé sous les conseille de **pan547** que je remercie:  
[https://developer.mozilla.org/fr/docs/Web/CSS/CSS\_Box\_Alignment](https://developer.mozilla.org/fr/docs/Web/CSS/CSS_Box_Alignment)

Alors dans mon css se retrouve :

```css
.LiBox {
  margin-left: 8em; margin-right: 6em;
  display: grid;
  grid-template-columns: 4em 42em;
  align-items: start;
}

```

et dans mon html:

```auto
<div class="LiBox">AA</span> &ensp;: </div><div> Définition plus ou moins longue de l’attribut cité juste précédement. Ici, dans cette exemple que je veux extraordinairement long c'est la définition de "AA" ... (...) Voilàààà point !!!</div></div>

```

Grosso modo:  
ça nous donne un  
AA suivit de deux espaces … suivit du double point … Là commence la définition qui quand elle revient à la ligne, comme voulu… se cale sur le début le premier caractère de la définition et non le premier A de AA …

Grand merci.  
Je m’était réellement engouffrer dans des montagne de trucs …

Now… ça marche avec un deux lettre…  
faudrat à mon avis si plus de deux lettres comme un AAAA,  
modifié cette ligne dans le css:

```css
grid-template-columns: 4em 42em;

```

Le 4 en un chiffre suppérieur à 4

Y a a mon sens plus simle et moyen de bien paufiné le bazar mais cela me suffit our le moment !

a++
