problem description

flex-item (parent element flex positioning, flex-item refers to its child elements) sets overflow-x: visible; overflow-y: auto , the x-axis beyond the container is not displayed. This is obviously not in line with the setting of overflow, so I want to know the reason under the phenomenon ~

problem advance

after testing, it is found that flex-item will prevent the display of content beyond the container as long as the overflow value is set to non-visible, on either axis. So maybe this is because flex-item does not support overflow-x/y, so it will only take effect of one of the values, etc.

Test example

  .container
  display flex
  height 200px
  .menu-c
    position relative
    flex-shrink 0
    width 40px
    background yellow
    /* display inline-block */
    /* overflow visible */
    overflow-y auto 
    overflow-x visible
    .test
      width 200px
      position absolute
      top 20px
      left 10px
      height 30px
      background black   

  .main-c
    flex 1 1 auto
    background blue

A ladder is needed to see the example, so adding
display inline-block to the code is to test whether the bfc feature affects