Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Flexbox display:inline-flex not really "inline"

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #241635
    qfactor
    Participant

    Hey design loving guys and girls,

    I am playing around with flexbox and aligning stuff. Here is a minimum example which uses display:inline-flex. I expect those two boxes lined up perfectly in a row, but the inlined flex-container actually does not and I canĀ“t figure out why. Please have a look at this pen.

    http://codepen.io/qfactor/pen/JXVzBe

    Actually it works, when flaoting the flex-container, but thats not what I want to use.

    greets
    qfactor

    #241645
    Atelierbram
    Participant

    Somehow flex-modules like to be within flex-containers, and there is this white-space thing that comes with display: inline-block which might be related. Anyway, forked your demo with an added flex-wrapper, which makes them line up.
    See the following answer by @paulie_d

    #241648
    Paulie_D
    Member

    Inlined elements, including inline-flex have a default vertical alignment of baseline…just change the alignment to top.

    http://codepen.io/Paulie-D/pen/zqQYzp

    #241675
    qfactor
    Participant

    Ahhh ok, things that are not explained somewhere else.
    Thank you so much ;)

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.