Since the new Bootstrap 4 is migrating from using 'floating' elements to the better 'flexbox' method, just wondering is it ok to construct the entire grid structure using .d-flex rather than the existing .container .row .col way?
Since both of them are fundamentally constructed using flexbox I don't see any downside of replacing one with another. In fact I feel that .d-flex requires less css class name and make things more readable within the html.
There are other reasons why I prefer d-flex than the old col:
Horizontal and vertical elements - d-flex supports creating elements both horizontally (.flex-row) and vertically (.flex-column). Col only support horizontally.
Inline element - The element's width will inherit from the child and can be align dynamically using d-inline-flex. Whereas col grid is fix.
Advance re-ordering - d-flex uses
.order-xand col uses.pushand.pull. In my opinion,d-flexis more intuitive, the order of elements are represented through numbering and on the other hand the number in.colis how many grids are being push and pull away from the previous state. It gets messy when you are building a more complex site....
Please correct me if I'm wrong.