Create Bootstrap tabs from Advanced Custom Fields

file.php

<div id="with_tabs_container" class="flex no-flex-xs-block">
    <div class="left_column">
        <?php if ( have_rows('tabs') ) { ?>
    		<ul class="list-unstyled green_tablist" role="tablist">
    		<?php $i=1; while ( have_rows('tabs') ) { the_row(); ?>

    			<li role="presentation" class="<?php if(1==$i) echo 'active'; ?>">
    				<a href="#tab_pane_<?php echo $i; ?>" role="tab" data-toggle="tab" title="<?php echo esc_attr(get_sub_field('tab_name')); ?>"><?php the_sub_field('tab_name'); ?></a>
    			</li>

    		<?php $i++; } // end while have tabs ?>
    		</ul>
    	<?php } // end if have tabs ?>
    </div><!-- .left_column -->

    <div class="right_column">
        <?php if ( have_rows('tabs') ) { ?>
    		<div class="tab-content">
    		<?php $i=1; while ( have_rows('tabs') ) { the_row(); ?>

    			<div role="tabpanel" class="tab-pane fade <?php if(1==$i) echo 'in active'; ?>" id="tab_pane_<?php echo $i; ?>">
    				<div class="wysiwyg_content">
    					<?php the_sub_field('tab_content'); ?>
    				</div><!-- .wysiwyg_content -->
    			</div><!-- .tab-pane -->

    		<?php $i++; } // end while have tabs ?>
    		</div><!-- .tab-content -->
    	<?php } // end if have tabs ?>
    </div><!-- .right_column -->
</div><!-- #with_tabs_container -->