# CSS puzzle: how would you achieve this?

**URL:** https://forum.kirupa.com/t/css-puzzle-how-would-you-achieve-this/291585
**Category:** web dev
**Created:** [July 1, 2009, 7:27pm UTC](https://forum.kirupa.com/t/css-puzzle-how-would-you-achieve-this/291585 "2009-07-01T19:27:00Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![chuggyhandbags](https://avatars.discourse-cdn.com/v4/letter/c/c57346/32.png) [@chuggyhandbags](https://forum.kirupa.com/u/chuggyhandbags)
#### Post date: [July 1, 2009, 7:27pm UTC](https://forum.kirupa.com/t/css-puzzle-how-would-you-achieve-this/291585/1 "2009-07-01T19:27:00Z")

</div>

Hey gang,

A friend asked me this earlier in the week and I wasn’t sure how to answer. What HTML/CSS would most effectively turn this code:

```auto
<div>
  <img src="image.png" />
  <p>Lorem ipsum...</p>
  <img src="image.png" />
</div>

```

Into something that looks like this (one image in top left of div, other in bottom right, with text flowing in between):

![](http://forum.kirupa.com/uploads/kirupa/5566/2bfa89f815dbcdcd.jpg)

Any thoughts are appreciated!