Forum : Retour a la ligne incontrôlable dans une div

Décrivez ici votre problème ou ce que vous cherchez à faire.
bonjour a tous
je suis occupé a styliser ma page
et je suis confronte a un soucis
voici le css

 <style>
            .information {
    color:#00BFFF;
    font-weight:bold;
    }

      </style>

lorsque je fais ce code

 <div class="col-lg">
         <?php    echo 'Ta ville est<div class="information">'. ($json->name).'</div>'  ; ?> 
                 </div>

cela se présente de cette façon
Ta ville est
gilly

par contre si je fais cela

<div class="col-lg">
         <?php    echo '<div class="information">Ta ville est'. ($json->name).'</div>'  ; ?> 
                 </div>

cela est écrit sur la même ligne

ta ville est Gilly

mais du coup toute la ligne est stylisée
alors que je ne voudrais que la variable

2 réponses

Curvata

Réponse acceptée

Bonjour,

une div veut prendre 100% de la largeur du parent donc elle se met à la ligne.

Tu as plusieurs solutions à ta disposition:

"inline-block" sur ta classe "information"

.information {
    display: inline-block;
    color:#00BFFF;
    font-weight:bold;
}

Entourer le nom de la ville avec une "span"

<div class="information">Ta ville est <span>blabla</span></div>

"d-flex" sur ta classe col-lg

.col-lg {
    display: flex;
}

flexi2202

Auteur

bonjour
merci pour la reponse
mais je viens a l instant de decouvrir la reponse
je n ai pas recu de notification

encore une fois desole