Grow your CSS skills. Land your dream job.

About alignment–img and text

  • # June 13, 2013 at 10:29 am

    Ok…so for some reason I am stuck on the most simple concept ever. ;_;

    I cannot, for the life of me, get my paragraph content to hang next to two images. The images are vertically aligned.

    It shows the paragraph to the left and then the two images below the paragraph but floating to the right. I know it’s a simple fix, I just can’t seem to figure it out :/

    Here is the code

    http://cdpn.io/uFeEK

    # June 13, 2013 at 10:33 am

    Wow….can you reduced that code dump to something more manageable?

    We don’t need the JS (unless it’s essential) and the HTML/CSS not related to your issue can be removed too.

    Also, you’d need to link live hosted images as yours don’t show up.

    Off-hand though, I would guess you need to re-think your HTML structure.

    # June 13, 2013 at 10:37 am

    Sorry about that. I am a little new here….

    Does this help?

    Check out this Pen!

    # June 13, 2013 at 10:46 am

    Yeah…that’s never going to work.

    You have two divs (one for text and another holding the two images)…the first floats left and the second right.

    You can’t get the text div in between the two images…the HTML isn’t structured that way.

    You’d need to have the text div sandwiched between two image divs/figures.

    Do you have a mock-up / image of what you are trying to do because I have a feeling (if my suspicions are correct) that it can’t be done as you might like.

    # June 13, 2013 at 11:15 am

    if I understand you correctly, you need to remove the clear: both; and the margin-left: 50%; from #LayoutDiv2

    # June 13, 2013 at 12:32 pm

    I think this is more what is required : http://codepen.io/Paulie-D/pen/vKDJp

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".