Image superposée sur <div>

Bonjour,

Voila j'ai un petit soucis en css, je voudrais afficher des news dans un div qui s'adpate automatiquement a ma longueur de texte, jusque la pas de probleme, mais j'aimerai y ajouter une image illustrant la news qui viendrait déborder sur le haut du div et ca j'y arrive pas.
Avec une illustration c'est plus parlant :
http://img240.imageshack.us/img240/1759/cssprobleme6qy.jpg
La partie rouge est mon div de longueur x qui s'adapte a la longueur du texte et la partie verte c'est celle que je voudrais rajouter.
Comment peut on faire ca, si c'est possible evidement.
D'avance merci !

bonjour,

je te propose en partant d'un div pour englober ta news et ton image,
de faire flotter l'image a gauche et de placer ton texte dans une balise p avec une marge a gauche et une marge haute interieur, decalant ainsi visuellement ton texte vers le bas.
J'ai ajouter un element "spacer", afin d'etirer le conteneur au dela de l'image si le texte est court(IE s'en passe ...).

<div class="zone_news">
<img src="ton image news" alt="image news manquante bla bla bla bla bla bla bla bla" />
<p class="margeh"></p><p class="txtnews">blabla blabla blabla 
blabla blabla blabla blabla blabla blabla blabla blabla blabla blabla 
blabla blabla blabla blabla blabla blabla blabla blabla blabla blabla 
blabla blabla blabla blabla blabla blabla blabla </p><span class="spacer"></span></div>

et le css

p {margin:0;/* pour avoir les memes marges par defaut d'un navigateur 
a l'autre */}
.zone_news img	{
float:left;
/* taille arbitraire, pour l'exemple */
margin-left:5px;
width:80px;
background-color:#2CFD01;/*  juste histoire de coloré en vert comme 
sur ton schema, quand il n'y a pas d'image a afficher. */
}
.txtnews	{
padding:1em;
padding-left:100px;/* largeur a reserver pour etre en decrocher/marge 
de l'image */
background-color:#FF0103;
}
.margeh {height:2em;}/*pour conserver cette espace vide a coté 
de l'image */
.spacer	{clear:both;/* pour placer le prochain element sous l'image */
display:block;
margin-bottom:2em;/* 1emx2 because fusion ! */
/* il est possible d'utiliser un div aussi ou une 
autre balise ce choix est perso */
}

voilou. j'espere que cela te conviendra et que ça repond a ta question.
Modifié par gcyrillus (10 Nov 2005 - 15:49)

Désolé je n'ai pu lire ta reponse avant aujourd'hui.
En adaptant un peu a ce que je voulais faire, ca marche bien merci !