+ 4

How do you make a menu?

11th Jul 2016, 7:19 PM
Mile-chan
Mile-chan - avatar
2 Answers
+ 16
Here is the simple one based on SoloLearn website menu. This is the code for your stylesheet. #menu { background: #d22929; float: left; list-style: none; margin: 0; padding: 0; width: 100%; } #menu li { float: left; font-size: 12px; font-family: "Verdana", "Arial", Helvetica, sans-serif; margin: 0px 10px 0px 0px; padding: 0; } #menu a { background: #d22929; font-size: 1.2em; color: #fff; display: block; float: left; margin: 0; padding: 7px 20px; text-decoration: none; } #menu a:hover { background: #d29c1a; color: #fff; } This is the code that goes in your actual HTML page. <html> <ul id="menu"> <li><a href="https://www.sololearn.com/Courses/" title="Courses">Courses</a></li> <li><a href="https://www.sololearn.com/Codes/" title="Codeplayground">Codeplayground</a></li> <li><a href="https://www.sololearn.com/Discuss/" title="Discuss">Discuss </a></li> <li><a href="https://www.sololearn.com/Leaderboard/" title="Top Learners">Top Learners</a></li> </ul> <html> Here is the link of the code in Codeplayground. https://code.sololearn.com/WWH5uq3JwKx2/#html Make your own changes and have fun :)
26th Oct 2016, 12:30 PM
//Lana Wilson
//Lana Wilson - avatar
+ 2
Thank you
16th Jun 2017, 6:13 AM
Mile-chan
Mile-chan - avatar