texte decalé dans div en float

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : texte decalé dans div en float

alexbel800

bonjour

le texte de mon div placé en float:gauche est décalé d'une ligne vers le bas

voici le code html:

<div id="prod">
<div id="l1">
<div id="l1g">
<p>Parapharmacie:</p>
<ul>
<li><a href="avene.php">Avene</a></li>
<li><a href="uriage.php">Uriage</a></li>
<li><a href="boots.php">boots</a></li>
<li><a href="innoxa.php">Innoxa</a></li>
<li><a href="gamme-phyto.php">Phyto</a></li>
</ul>
</div>

<div id="l1d">
<p>Bébés</p>
<ul>
<li><a href="mustela.php">Mustela</a></li>
<li><a href="novalac.php">Lait Novalac</a></li>
</ul>
</div>
</div>

<div id="l2">
<div id="l2g">
</div>

et mon css:

#prod
{
margin-top: 20px;
margin-left: 170px;
margin-bottom: 20px;
padding: 5px;
color: black;
border: 2px solid silver;
width:730px;
}

#l1
{
background-color:black;
width:710px;
}

#l1g
{
font-size: 20px;
float:left;
margin-left: 10px;
width : 350px;
height: 200px;
margin-right: 80px;
background-color:blue;
}

#l1d
{
font-size: 20px;
text-align: ;
margin-left:50%;
width : 350px;
height: 200px;
margin-right: 80px;
background-color:red;
}

Mes blocs se placent correctement, le texte de div l1d est collé au haut du bloc
Le probléme vient du texte du div l1g qui est décalé vers le bas dans le bloc

Si j'enléve le float, le texte revient à la bonne place (mais mes blocs ne le sont plus!)

Si quelqu'un pouvait m'aider ...

Publicité

jerem94400

Voilà comment j'aurais fais moi, en espérant t'avoir aidé.
------------------------------------------------------
HTML :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>.</title>
</head>
<body>

<div class="prod">
<div class="l1">
<div class="l1g">
<p>Parapharmacie:</p>
<ul>
<li><a href="avene.php">Avene</a></li>
<li><a href="uriage.php">Uriage</a></li>
<li><a href="boots.php">boots</a></li>
<li><a href="innoxa.php">Innoxa</a></li>
<li><a href="gamme-phyto.php">Phyto</a></li>
</ul>
</div>

<div class="l1d">
<p>Bébés</p>
<ul>
<li><a href="mustela.php">Mustela</a></li>
<li><a href="novalac.php">Lait Novalac</a></li>
</ul>
</div>
</div>

<div class="l2">
<div class="l2g">
</div>

</body>
</html>

-----------------------------------------------
CSS :

a {
text-decoration: none;
}

.l1 {
display: flex;
justify-content: center;
}

.l1d {
background-color: red;
padding: 20px;
}

.l1g {
background-color: yellow;
padding: 20px;
}

-----------------------------------------

alexbel800

merci beaucoup jerem
en ajoutant juste le padding ça fonctionne, je n'y avais pas pensé
merci de m'avoir donné de ton temps

ps: désolé, je n'avais pas réagi que je laissais des noms de marques, ce n'était absolument pas fait exprès. Je serai plus vigilent la prochaine fois.

jerem94400

Je t'en prie, bonne continuation.

FORUM HardWare.fr

Programmation

HTML/CSS

texte decalé dans div en float

Sujets relatifs
Texte qui suit image !	transformer un fichier texte en XML
changement de font-family de texte selectionné	texte sous une image
Modifier un texte	Centrage float etc... :D
recupérer une chaine de texte d'un variable FOR	Coloration de code dans un texte
Vba word en-tête image + texte
Plus de sujets relatifs à : texte decalé dans div en float

Page générée en 0.034 secondes