html - css div stick to parent -

html - css div stick to parent -

i have following:

<div class="outer"> <p class="pclass">context...</p> <div class="inner"> <img.../> </div> </div>

the inner div width different depending on image width.

the p width should depend on image width.

p contain dynamic text. problem if p's text bigger image widht, jumps on top of image.

i've tried around using css "text-overflow", needs width.

also not working, setting margin:0 on img, hoping create stick surounding div.

try below simplifies code bit.

<div class="outer"> <p><img src="">context...</p> </div> .outer { overflow: hidden; } .outer img { float: right; margin: 0 0 20px 20px; }

if need have div around image can add together 1 around image , set have float , margin properties image has , set display: inline-block e.g.

<div class="outer"> <p><div><img src=""></div>context...</p> </div> .outer { overflow: hidden; } .outer div { display: inline-block; float: right; margin: 0 0 20px 20px; }

css html