Home/ Questions/Q 8603377
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T02:18:32+00:00

I must be having an off day, I’m being confused by css. I have

  • 0

I must be having an off day, I’m being confused by css.

I have an image that may or may not exist. With minimal markup I would like to push over an entire block of text so that it doesn’t wrap under the image if it’s too long. Normally I would just float the image and use a set margin, but since the image won’t be there sometimes I want a more flexible solution. Maybe this illustration will help.

enter image description here

I can’t think of any way to do it without extra markup or dynamically using two different classes. Most of what I’ve tried involves floating one or both elements. The p doesn’t have a set length so putting padding-bottom under img is either not enough in some cases or causes unnecessary space if p is too short. Any suggestions?

Edit: Here’s a jsfiddle courtesy of Mark Adams, but it’s pretty much where I’m stuck at.

JSFiddle

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Can’t you just make the image float left? Or am I missing something from your question?

    Like this:

    http://jsfiddle.net/cGQ6K/

    edit- or did you want the image to disappear if there’s an overflow on the paragraph or something like that?

    edit2-after adding more text to my paragraph in my jsfiddle I think I know what you mean now…I’ll try to work out a solution

    edit3 – here is the solution you want : http://jsfiddle.net/cGQ6K/7/ It uses a little hack though.

    • 0