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.
Hi Robin, I'm not sure I understand what you're saying. Applying float: left; to the image makes the text wrap, but you may want to add padding to the image as well.
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.
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
Hi Robin, I'm not sure I understand what you're saying. Applying
float: left;to the image makes the text wrap, but you may want to add padding to the image as well.Add
overflow: hidden;to your#postand it clears the float for you.You would obviously be better off using a clearfix...
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
Thanks Watson90 I added the overflow and it works now.
Greetings, Robin
@biodiscus, you should do a clearfix instead of the hidden overflow like @Watson90 suggested, it will save you some headaches later.
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-shadowto your grey containers then they would get cut off with the overflow property. JFYI.Thanks everyone!
I added the clearfix and still works like a charm.
Good stuff =)