Grow your CSS skills. Land your dream job.

Seems like a simple fix but im drawing a blank, floating elements!

  • # May 2, 2013 at 3:52 pm

    Hey folks,

    I want all of my floating divs to line up, but my two middle divs are causing a problem resulting in my far right “blue” div to get nudged down.

    Here is the CodePen, thanks for any suggestions.

    I feel that i could just make a container in the middle to hold my B & C elements, however, i feel that there could be a more elegant solution.

    # May 2, 2013 at 4:46 pm

    That the normal behaviour.

    The divs load in order and use their assigned widths. If they can’t fit into the remaining space they drop down…but they can’t float up further than the previous element

    # May 2, 2013 at 5:10 pm

    @Paulie_D, thanks for the explanation (knowledge is everything). Appreciate the response, do you think adding a middle container would equate to un-needed markup?

    I added an extra div to act as a wrapper (giving the wrapper the % width).

    CodePen

    # May 2, 2013 at 5:17 pm

    You can pull it in place with `margin-top: -30px;`, or probably relative positioning.

    # May 2, 2013 at 5:22 pm

    @CrocoDillon, thanks man.. Taking a month off made me forget the simplest of simple things.. lol thanks again croco and paulie :)

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

You must be logged in to reply to this topic.

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