Bonjour,

Voici mon code intial :

<p style="text-align: center;"><span style="color: #e6511e;">4.</span> La présentation de votre site tient-elle compte du phénomène de lecture scannée ?</p>

Ce qui visuellement se traduit par (les barres noires de chaque côté symbolisent les bords de la fenêtre du site):

Je souhaitais que cette ligne reste sur une ligne. J'ai donc transformé mon code ainsi :

<p style="text-align: center;"><span style="white-space: nowrap"><span style="color: #e6511e;">4.</span> La présentation de votre site tient-elle compte du phénomène de lecture scannée ?</span></p>

Mon texte est à présent bien sur une ligne mais il n'est plus centré.

Pouvez-vous me dire ce que j'ai mal fait ? Précision : je suis totalement débutant. Merci

Salut,

la propriété white-space est ta nouvelle amie (ou ton pire ennemi...)

Edit : j'ai lu trop vite ton message...
Et si tu mets le white-space sur le <p> plutôt que sur le <span> ?

RE-edit : j'ai testé ton code et le texte est parfaitement centré. Il n'y a pas autre chose dans ta CSS qui créerai le problème ?
Tu parle de liste, tu as bien enlever le padding par défaut de <ul> ?
Et du coup pourquoi des <p> dans des <li> ?
Et tu as pensé à ce qui va se passer si le texte est plus grand que la largeur de la page ? Sur tablette et mobile par exemple.

-
Edité par Frogweb 12 octobre 2018 à 12:40:07

Bonjour,

Merci beaucoup pour ta réponse.

Du point de vue de la situation je suis sur Divi au sein du code d'un élément texte qui a été généré automatiquement et que j'essaye d'aménager.

Pour répondre à ta question <li> et <ul>, ma liste est une fausse liste puisqu'il s'agit de 10 lignes de texte centrées avec une numérotation manuelle donc pas pas de <li>

Et si tu mets le white-space sur le <p> plutôt que sur le <span> ?

J'ai essayé mais ça ne donne rien mais peut-être ai-je fait une erreur de formulation. Quelle serait la bonne écriture pour l'insérer sur le <p> ?

RE-edit : j'ai testé ton code et le texte est parfaitement centré.

C'est étonnant. Est-ce que Firefox pourrait générer ce problème ?

Il n'y a pas autre chose dans ta CSS qui créerait le problème ?

A priori non, mes 10 lignes étaient, avant que je rentre mes petits aménagements, syntaxées à l'identique avec juste une demande de <p> centré en début de ligne.

Et tu as pensé à ce qui va se passer si le texte est plus grand que la largeur de la page ? Sur tablette et mobile par exemple.

Je viens de Wix où tout se réaménage par écran en glisser déposer alors... pas vraiment :-)

Sans doute serait-il préférable que je passe à la ligne cette grande phrase mais j'essaie juste de comprendre. C'est agaçant quand ça veut pas :-)

J'ai testé dans Firefox et aucun problème.

Suis ce lien, j'ai repris exactement ton code et si tu diminue la fenêtre tu vois que c'est bien centré :

http://www.frogweb.fr/demos/white-space.html

ce qui me fait dire que autre chose vient perturber le centrage.

Il y a moyen de voir la page en ligne ou que tu nous donne plus de code ?
Par exemple le html et la CSS des parents de ton élément.