HTML CSS examples for CSS Widget:Menu
Horizontal menu that resizes nicely
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> #menu {<!--from ww w .jav a 2 s . com--> height:126px; margin:0 auto; text-align:justify; -ms-text-justify:distribute-all-lines; text-justify:distribute-all-lines; min-width:91%; } #menu li { max-width:151px; vertical-align:top; display:inline-block; *display:inline; zoom:2 } #menu:after { content:''; width:100%; display:inline-block; font-size:0; line-height:0 } @media screen and (max-width:730px) { #menu { min-width:2px; width:36%; } } </style> </head> <body> <ul id="menu" style="list-style:none"> <li> <a href="#asics">Lorem</a> </li> <li>L</li> <li> <a href="#plants">Lorem ipsum</a> </li> <li>L</li> <li> <a href="#tooheys">Lorem i</a> </li> <li>L</li> <li> <a href="#olympics">Lorem ip</a> </li> <li>L</li> <li> <a href="#panadol">Lorem i</a> </li> <li>L</li> <li> <a href="#kia">Lorem ipsum</a> </li> </ul> </body> </html>