Image en dehors d'un div
Résolu
Meph
Messages postés
16
Statut
Membre
-
Meph Messages postés 16 Statut Membre -
Meph Messages postés 16 Statut Membre -
Bonjour,
Je vous explique mon problème, dans le cadre scolaire je dois developper un mini-site. J'ai defini le "design" avec le css grace à des balises <div>, malheureusement lorsque j'insère une image dans la page html, celle-ci sors du corps et cela est plutôt disgracieux.
Voici le code concerné:
HTML
<div id="corps">
<hr>
<h1><p align="center">Donjon de Naheulbeuk</p></H1>
<hr>
<p>Il s'agit ici pour moi de vous faire découvrir cette saga mp3, inspirée du monde des jeux de rôle, de la fantasy et des jeux vidéos. Pour cela je vous propose la saison en téléchargement à partir de cette page.</p>
<ul>
<li><a href='ftp://audio.naheulbeuk.com/naheulbe/donjon-s1-ep1-8.zip'>Episodes 1 à 8.</a></li>
<li><a href='ftp://audio.naheulbeuk.com/naheulbe/donjon-s1-ep9-15.zip'>Episodes 9 à 15.</a></li>
</ul>
<p>Pour ceux qui auraient apprécier cet humour si particulier, je vous donne <a href="http://www.penofchaos.com/warham/donjon-resume.htm">ici</a> le lien vers le site du créateur, Pen of Chaos.
<img src="donjon.gif" align="left" valign="bottom" alt="le nain" />
</div>
CSS
#corps
{
width: 590px;
border: 2px solid black;
margin-left: 140px;
margin-bottom: 20px;
padding: 15px;
background-color: #c95d68;
}
Je vous explique mon problème, dans le cadre scolaire je dois developper un mini-site. J'ai defini le "design" avec le css grace à des balises <div>, malheureusement lorsque j'insère une image dans la page html, celle-ci sors du corps et cela est plutôt disgracieux.
Voici le code concerné:
HTML
<div id="corps">
<hr>
<h1><p align="center">Donjon de Naheulbeuk</p></H1>
<hr>
<p>Il s'agit ici pour moi de vous faire découvrir cette saga mp3, inspirée du monde des jeux de rôle, de la fantasy et des jeux vidéos. Pour cela je vous propose la saison en téléchargement à partir de cette page.</p>
<ul>
<li><a href='ftp://audio.naheulbeuk.com/naheulbe/donjon-s1-ep1-8.zip'>Episodes 1 à 8.</a></li>
<li><a href='ftp://audio.naheulbeuk.com/naheulbe/donjon-s1-ep9-15.zip'>Episodes 9 à 15.</a></li>
</ul>
<p>Pour ceux qui auraient apprécier cet humour si particulier, je vous donne <a href="http://www.penofchaos.com/warham/donjon-resume.htm">ici</a> le lien vers le site du créateur, Pen of Chaos.
<img src="donjon.gif" align="left" valign="bottom" alt="le nain" />
</div>
CSS
#corps
{
width: 590px;
border: 2px solid black;
margin-left: 140px;
margin-bottom: 20px;
padding: 15px;
background-color: #c95d68;
}
Configuration: Windows Vista Firefox 3.5.3
11 réponses
-
Ajoute style="width:400px;" sur ta balise img, ainsi ton image ne fera que 400 pixels de largeur ; La hauteur sera automatiquement calculée pour conserver les proportions.
-
Je me suis mal exprimé, la taille de l'image est parfaite, le souci est qu'elle sort du cadre defini par le corps (<div id="corps"></div>), de plus mon style css est sur une feuille de style.
-
C'est qu'elle est trop grande alors réduits-la comme je l'ai expliqué ou bien agrandi ton div #corps
-
Le souci c'est que du coup mon div va plus avec mes autres pages.
-
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question -
Tu as oublié de fermer ta dernière balise <p>... le problème vient p-e de là ! Sinon essaye de mettre ton image avant le texte...
-
Merci pour la balise mais j'ai trouve la solution ;). J'ai cree un div avec l'image à l'interieur.
-
Merci pour la balise mais j'ai trouve la solution ;). J'ai cree un div avec l'image à l'interieur.
Maintenant l'ideal serait de mettre l'image en bas à gauche contre la bordure du corps.
Le probleme est que celui-ci a des marges interieures que je ne peux pas supprimer sans modifier le style de tout le site. J'avais pense à la superposition mais je ne suis arrive à rien, donc si quelqu'un avait une idée ce serait génial. -
Marque ton sujet en "résolu" alors ! :D
Bonne continuation ! -
Desole, j'ai eu un souci de post ^^. Je mets mon message en resolu et je poste un nouveau message ou je le laisse ici ?
-
Le mieux est de cloturer ce sujet de "revenir" avec un autre... comme ça ceux ayant le même problème pourront trouver la réponse facilement et sans être noyer dans une multitude problèmes divers ! ;)
-
