Search code examples
cssbootstrap-4right-to-left

How to right to left bootstrap 4 columns

I copied form example of Bootstrap 4, But I can't change its direction from right to left.

.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

@media (min-width: 768px)
<style>…</style>
.col-md-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}

After removing flex styles, right float style can change it to rtl direction. But is there another way to change its direction without ignoring flex styles?

Solution

  • I was not enough familiar with flex style. After reading the whole flex styles, I found this way:

    .row {
    flex-direction: row-reverse;
}

    I think this is the right way to change the direction.