Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- //PASTED FROM : http://www.htmldrive.net/items/show/437/CSS3-only-horizontal-drop-line-tab-menu
- //PURPOSE: For further modification
- #access {
- padding: 10px 0 0 0;
- margin-bottom: 40px;
- border-bottom: 1px solid #999 !important;
- }
- .menu {
- float: left;
- width: 960px;
- margin: 0;
- padding: 0;
- list-style: none;
- background: #dc0000;
- }
- .menu li {
- display: inline;
- }
- .menu li a {
- float: left;
- color: #fff;
- text-decoration: none;
- margin: 0;
- padding: 0 30px;
- background: #dc0000;
- }
- /* APPLIES THE ACTIVE STATE */
- .menu .current a, .menu li:hover > a {
- color: #fff;
- text-decoration: none;
- background: #bb0000;
- }
- /* THE SUBMENU LIST HIDDEN BY DEFAULT */
- .menu ul {
- display: none;
- }
- /* WHEN THE FIRST LEVEL MENU ITEM IS HOVERED, THE CHILD MENU APPEARS */
- .menu li:hover > ul {
- position: absolute;
- display: block;
- width: 960px;
- height: 25px;
- margin: 23px 0 0 0;
- background: #315299;
- }
- .menu li:hover > ul li a {
- float: left;
- color: #fff;
- text-decoration: none;
- margin: 0;
- padding: 0 30px 0 0;
- background: #315299;
- }
- .menu li:hover > ul li a:hover {
- color: #120000;
- text-decoration: none;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement