How can I reorder elements horizonal in navbar based on screen size (bootstrap)

Question

In my html page the elements are properly fixed in the navbar.

1 2 3 4 5 6 7 

when the screen is smaller the elements are in vertical