有没有一个原因，为什么这段代码不会与flex-box一起工作，目前我想使用交替网格模式。允许前两个项目并排放置，第三个项目占据整个宽度。我不认为我离这里很远，但我会感谢任何人能给我的帮助。我在下面附上了我正在使用的代码。
非常感谢。

<section id="about-sect">
<div class="wrapper">

<?php if ( have_rows( 'about_me' ) ) : ?>
    <?php while ( have_rows( 'about_me' ) ) : the_row(); ?>
    <div class="item">
        <?php $portrait = get_sub_field( 'portrait' ); ?>
        <?php if ( $portrait ) : ?>
            <img id="becs-portrait" src="<?php echo esc_url( $portrait['url'] ); ?>" alt="<?php echo esc_attr( $portrait['alt'] ); ?>" />
        <?php endif; ?>
    </div>
    <div class="item" id="founded-by">
        <h1><?php the_sub_field( 'about_header' ); ?></h1>
        <p><?php the_sub_field( 'about_description_paragraph' ); ?></p>
    </div>
    <div class="item">
        <?php the_sub_field( 'solution' ); ?>
    <?php endwhile; ?>
    </div>
<?php endif; ?>

</div>
<section>

/* About Me Section */

# about-sect {

    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.item {
    width: 48%;
    height: auto; 
    margin-bottom: 2%;
}

.item:nth-child(3n) {
    width: 100%;
  }

# becs-portrait {

    width: 300px;
    border: solid #000000 10px;
    border-radius: 50px;
}

# founded-by {

    width: 300px; 
}

# founded-by h1 {

    border-bottom: solid #FF00AD 10px;
}

/* End of About Me Section */