1

I'm wondering what is the display mode of a child element that is inside a flexbox container.

Is it inline-block? Or it doesn't have anything to do with the usual display modes?

  .flexbox {
      display: flex;
    }

    span {
        width: 200px;
    }
 <div class="flexbox">
      <span>child</span>
    </div>

For example, the child span is affected by the width, so it isn't inline anymore.

I thought about this when I saw a span that was being affected by the width and it didn't have any display set, according to the Chrome inspector. Then I realised that it was inside a flexbox container. But, shouldn't the inspector tell me that the display was changed? (Changed to what?, that's the question).

Sumit patel
  • 3,807
  • 9
  • 34
  • 61
Ferran Maylinch
  • 10,919
  • 16
  • 85
  • 100
  • 3
    Possible duplicate of [What are allowed values of the \`display\` property for a flex-item? (layout of flex-item’s children is irrelevant)](http://stackoverflow.com/questions/39261797/what-are-allowed-values-of-the-display-property-for-a-flex-item-layout-of-fl) – kukkuz Sep 28 '16 at 08:57
  • 1
    @kukkuz thank you!, I searched but didn't find that question. – Ferran Maylinch Sep 28 '16 at 09:00
  • Seems to be `block` in this case, see http://i.stack.imgur.com/ClZDg.png – SeinopSys Sep 28 '16 at 13:58

1 Answers1

0

It's not like inline-block, since you cannot align it with text-align. Since it's parent gets property of display:flex, I suggest we could just call it "flex item". I agree there should be some indication in the Inspector that this is a flex item, but currently - there is none.

yuvalsab
  • 455
  • 9
  • 20