I created a view by using bootstrap class format.
When i am using bootstrap 3 then all col (col-lg-6) are working fine. But when i shift to bootstrap 4 cols are not working fine.
This code i am using in view
[wpv-layout-start]
[wpv-items-found]
<!-- wpv-loop-start -->
<div class="container">
<wpv-loop>
<div class="row">
<div class="picks-content">
<div class="picks-image col-sm-3">[types field='image' title='%%TITLE%%' alt='%%ALT%%' size='full'][/types]</div>
<div class="picks-title-details col-sm-6">
<div class="picks-title col-sm-12">[types field='title'][/types]</div>
<div class="picks-brand col-sm-12">[types field='brand-name'][/types]</div>
<div class="picks-addi-info col-sm-12">
<div class="row">
<div class="picks-more-info col-sm-6">More Info</div>
<div class="picks-why-special col-sm-6">[types field='best-quality'][/types]</div>
</div>
</div>
</div>
<div class="picks-links col-sm-3">
<div class="picks-rating">[types field='rating' ][/types]</div>
<div class="picks-btn-link">View Deal</div>
</div>
</div>
</div>
</wpv-loop>
</div>
<!-- wpv-loop-end -->
[/wpv-items-found]
[wpv-no-items-found]
[wpml-string context="wpv-views"]No items found[/wpml-string]
[/wpv-no-items-found]
[wpv-layout-end]
Please help me to solve this.
Shane
Supporter
Languages:
English (English )
Timezone:
America/Jamaica (GMT-05:00)
Hello,
Thank you for getting in touch.
The issue could be the div that you've added between the Row and the First column.
Bootstrap 4 operates a little different from bootstrap 3 in that Boostrap 4 uses flexbox to do the columns while in 3 they use floats.
The extra div you've added could be interfering with the flexbox.
Could you remove it and let me know if the issue still remains ?
Thanks,
Shane
My issue is resolved now. Thank you!