Change Order of HTML Elements Without Changing HTML

Sometimes, you might be in a situation where you have a web page showing one element above another as shown in the HTML code but you want the 2nd element to appear above the first element in the browser. One way to accomplish this using just CSS is by using flex, flex column, and order. Witness below. By changing the value of “order”, you can change the order the element appears in the browser.

See the Pen BzNmLp by Abdullah Yahya (@javanigus) on CodePen.