ke2211975
-
Posts
1 -
Joined
-
Last visited
ke2211975's Achievements
Newbie (1/7)
0
Reputation
-
ke2211975 joined the community
-
About styling a list horizontally to create a navigation menu
ke2211975 posted a topic in HTML/XHTML
Below is the way showed on W3 tutorial, I curious what the difference to put CSS property: float in "li a" style but "li"? Why? <!DOCTYPE html> <html> <head> <title></title> <style> ul{ list-style-type: none; padding: 0px; margin: 0px; overflow: hidden; background-color: #333333 } li{ float: left; } li a{ display: block; padding:16px; color: #ffffff; text-decoration: none; text-align: center; float: block; } li a:hover{ background-color: #111111; } </style> </head> <body> <h1>nvigation menu</h1> <p>Use CCS to style the list horizonally, to create navigation menu</p> <ul> <li><a href="deafalt.asp" target="_self" >Home</a></li> <li><a href="deafalt.asp" target="_self">News</a></li> <li><a href="deafalt.asp" target="_self" >Contact</a></li> <li><a href="deafalt.asp" target="_self" >About</a></li> </ul> </body> </html>