Probleme : Margin-top négative sur image

Bonjour,
J'ai un site sur Wordpress où j'ai problème d'affichage sur des div qui comporte un titre, une image en float left ou right avec une margin-top négative pour faire dépasser l'image de la div contenante.
Mon problème est que si mon titre est sur deux lignes, le margin-top ne s'affiche pas correctement (mon image ne dépasse plus de la div).

Voir mon cas ici.
Sur le deuxième bloc, mon titre est sur deux lignes et mon image n'est pas correctement placée (mon image ne dépasse plus de la div).

Toute aide serait grandement appréciée.
Modifié par whoaloic (06 Apr 2014 - 23:26)

tu peut te servir d'un conteneur pour ton image ou d'un pseudo de façon a squatté l'espace que doit occuper l'image. Pour l'image, tu peut alors la positionne en absolu au dessus de cette espace. il te faut un parent en position:relative , par exemple tes div.valeur.
++

J'utilise déjà un conteneur pour mes images (div class "valeur-image").
J'ai également rajouté un pseudo élément before à cette div, mais le problème reste le même : le conteneur n'est pas disposé de la même manière si il y a deux lignes au titre.

Par contre, je peux "tricher" en mettant un "height" fixe au titre.

as tu essayer comme je le sous-entendais :

.valeur {
position:relative;
}
conteneur-image { /* je degage la zone d'eventuelle contenu texte/image */
float:left/right;/* selon seconde class associeé*/
height:xx;
width:xx;
}
conteneur-image img {
position:absolute;
top:-1em;
left : 1em ; /*ou right selon classe parent */
}

avec un html adapté au flottement:

<div class="valeur">
  <div class="conteneur-image  quiflotte">
    <img class="en-position-absolu"/>
  </div>
  <h2> titre</h2>
</div>

?
le conteneur de l'image peut ne pas etre styler et remplacer par un pseudo:before dans h2 qui flotte a droite ou gauche pour reserver un espace libre ou le texte et image en absolu ne se super-positionneront pas, option ne nécessitant pas de modifier la structure
Modifié par gc-nomade (09 Apr 2014 - 15:02)