html - Menu items order on mobile version (float problems) -


when menu go hamburger menu items display:block value. items don't right order because of float:right property on last 3 items.

i stuck ideas, can make 2 menus think not right way.

codepen preview here

if want different order without creating 2 menus take @ using flexbox , order property: https://www.w3schools.com/cssref/css3_pr_order.asp

in mobile view along lines of:

header ul {     display: flex;     flex-direction: column; }  header ul li:nth-child(5) {     order: 7; }  header ul li:nth-child(6) {     order: 6; } 

Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -