Liens qui s'affichent mal.

Bonjour,
Savez vous pourquoi le texte des liens s'affichent mal dans cette image?

Merci pour vos explications.

Bonjour abeille,

Tu te doutes bien qu'il va être difficile de répondre sans ton code (HTML/CSS) ou mieux, une page en ligne (ou à minima une page de test hébergée sur un outil en ligne : codepen, jsfiddle, dabblet, etc.).

À plus.

6l20 a écrit :
Bonjour abeille,

Tu te doutes bien qu'il va être difficile de répondre sans ton code (HTML/CSS) ou mieux, une page en ligne (ou à minima une page de test hébergée sur un outil en ligne : codepen, jsfiddle, dabblet, etc.).

À plus.

Oui tu as raison, je suis un abominable paresseux!
Voici le Html:

<div class="floatleft"><a title=""><img src="C:\Users\lanor\Desktop\sitebombe\photosbombes\mururorajuin70.jpg" alt="" width="530" height="700"/></a>
<p class="paragraphe"><span class="gras">Lors d'une explosion, le champignon atomique s'élève à plusieurs kilomètres d'altitude. </span><br />
<a href="https://youtu.be/_TOSuF-bANg">Vidéo d'une explosion en Syrie.</a>Il s'agit ici d'une explosion avec poussières, de coeff Phi 4.5
<br><a href="https://youtu.be/Lib-2zCJFBs?t=3m20s" target="_blank">Autre vidéo d'une explosion en Syrie.</a>Sur cette image, le coeff Phi passe à 4.2 
</div>

Et le CSS:

.floatright a{
	float: right;
    border: 10px solid #F2F2F2;
}

.paragraphe{
line-height: 170%;
font-size: 170%;
text-align: justify;
}

Merci pour ton aide!

On n'a pas tout le code css mais ce n'est pas grave...

Un float est appliqué sur les liens via le conteneur, ce qui a pour conséquence de leur donner un comportement block. D'où le bug graphique.

Mais peut être le texte n'aurait-il pas dû se retrouver dans le conteneur .floatleft qui aurait dû, je pense, être réservée à l'image seule ? Dans ce cas là il suffit de refermer la div après l'image, et non après le texte.
Modifié par Olivier C (06 Mar 2016 - 15:43)

Olivier C a écrit :

Mais peut être le texte n'aurait-il pas dû se retrouver dans le conteneur .floatleft qui aurait dû, je pense, être réservée à l'image seule ? Dans ce cas là il suffit de refermer la div après l'image, et non après le texte.

Eh bien merci, ça fonctionne parfaitement comme ça.

<div class="floatleft"><a title=""><img src="C:\Users\lanor\Desktop\sitebombe\photosbombes\mururorajuin70.jpg" alt="" width="530" height="700"/></a>
<p class="paragraphe"><span class="gras">Lors d'une explosion, le champignon atomique s'élève à plusieurs kilomètres d'altitude. </span></div><p class="paragraphe">
<a href="https://youtu.be/_TOSuF-bANg">Vidéo d'une explosion en Syrie.</a>Il s'agit ici d'une explosion avec poussières, de coeff Phi 4.5
<br><a href="https://youtu.be/Lib-2zCJFBs?t=3m20s" target="_blank">Autre vidéo d'une explosion en Syrie.</a>Sur cette image, le coeff Phi passe à 4.2</p>

Je pensais que le float ne s'appliquait qu'à un conteneur.
En fait non, il s'applique au texte à partir de l'endroit où est placée l'image.

Merci pour ton explication très simple!