How i set float right to the last element of the menu bar (last li element)

Question

I create a menu bar which also contains a sub menu . I think it works perfectly ? but i cannot target the last element to the right of the navigation bar and other elements are centred on the page along with x axes of navigation bar

Thanks for viewing my question. If you can suggest more improvements you can it will help to boost my CSS career

https://code.sololearn.com/WZMkc1Oto4i5/?ref=app

Answer 1

nav ul {
...
display: flex;
justify-content: center ;
}

With this you can center your menu on the x axis.

Answer 2

nav ul li:last-child {
float: right;
}

Answer 3

Then you should separate the last element with another nav div. Only then you can style 2 divs with different flex justify content

Please check out the new div and css styles
https://code.sololearn.com/WuMJXVCPdP8D/?ref=app

Answer 4

Thanks You brother Calviղ

Answer 5

Thank you brother Hector Alexis Romero Morales but if i use this properties then o can not move last child float right

Answer 6

Not please solve both problem to to the center menu items and last child move to the right Calviղ

Answer 7

theres a typo, chlid instead of child. and yes its easier with flexbox.