CSS gap issue in div element

Question

The items are not listed in order there is a gap between item listed how to fix this.

Screenshot: https://prnt.sc/sphfig

            <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
                <div class="tg-topcity">
                    <figure class="tg-cityimg">                                 
                        <img src="<?php echo esc_url( $cat_image ); ?>" alt="<?php esc_html_e('City Image', 'listingo'); ?>">                                   
                        <figcaption>                                        
                            <h3><a href="<?php echo esc_url( get_term_link( $value->term_id, 'cities' ) ); echo esc_attr( $custom_url  ); ?>"><?php echo esc_attr( $value->name ); ?></a></h3>
                            <span><?php echo esc_attr( $total_users ); ?>&nbsp;<?php esc_html_e('Listings', 'listingo'); ?></span>                                      
                        </figcaption>
                    </figure>
                </div>
            </div>
        <?php } } ?>
    </div>

CSS

.tg-topcity, .tg-popularcities {
    width: 100%;
    float: left;
}
0
Emma Expat 4 years 2020-05-28T10:10:27-05:00 0 Answers 89 views 0

Leave an answer

Browse
Browse