billede rager ud af float div

Hvordan virker:

min-height:200px; ?-)

Hvad med
overflow: auto;

med min-width så bliver alt 100% bredt da der er en mase tekst. med oveflow auto så blover overflow sat til scroll hvilket heller ikke er så heldigt.

har ind til videre snyt lidt med jQuery (jquery.com):

  $(document).ready(function() {
    $('.element > img').each(function() {
      $(this).parent().width($(this).width());
    });;
  });


Hvor .element er de klasser der skal tilpasses i breden.

margin: 0px 10px 20px 10px??

Hvad med height ?

height skal justere sig efter indholdet så den ville jeg ikke sætte.

Prøv at sætte dit img{ float: left;} også.

Du kan desværre ikke sætte et element til en fastsat width og så få den til at udvide sig ved indsættelse af et billede (medmindre du laver det via. javascript). Hvis billedet skal forårsage en udvidelse af width skal teksten også.

Prøv f.eks. at udvide tekst mængden i nedenstående og eller indsætte et billede:

<div style="float:left;background:#555;">blabla blabla blabla blabla blabla blabla blabla bla</div>
... man kan selvfølgelig putte teksten indvendig i en ekstra div og have billedet for sig selv, men der er jo så ingen wrapping af teksten om billedet - men elementet vil stadig udvide sig

<div style="float:left;background:#555;"><div style="width:300px;">blabla blabla blabla blabla blabla blabla blabla bla blabla blabla bla  blabla blabla bla</div>billedebilledebilledebilledebilledebilledebilledebilledebillede </div>

- Den eneste løsning jeg kan komme m.h.t. textwrapping om billedet er at serverside måle billedet og så outputte en width definering direkte på elementet efter behov.