Aligning text next to an image

[biodiscus]

Hello all,

The title is what I want, but the problem is that the text gets underneath the image. But know I want to align the text next to an image. I’ve googled a bit, but I didn’t find a way.

The google result where almost everywhere the same, using float fixes 1 problem, but the container needs to scale (in the height) with it.

If anyone is wondering what I exactly mean here is the page: http://test.biodiscus.net/portfolio.php

Is there any way to get this result?

Greetings,
Robin

[Watson90]

Add `overflow: hidden;` to your `#post` and it clears the float for you.

You would obviously be better off using a [clearfix](https://css-tricks.com/snippets/css/clear-fix/ “”)…

[biodiscus]

Hi ChrisP,

This does work when working with big texts.
With a big text it looks like: http://biodiscus.net/files/2.png
But when using a small text, it doesn’t work as I would like: http://biodiscus.net/files/1.png

[biodiscus]

Thanks Watson90 I added the overflow and it works now.

Greetings,
Robin

[Watson90]

Cool, as I said you’re probably better adding the clearfix though, I just quickly tested in Chrome Tools using `overflow: hidden;` to see if that was the problem and it was.

Let’s say you ever want to add some `box-shadow` to your grey containers then they would get cut off with the overflow property. JFYI.

[biodiscus]

Thanks everyone!

I added the clearfix and still works like a charm.

[Watson90]

Good stuff =)

[Author]

Posts