Team:Uppsala/navbar.css
From 2014.igem.org
Line 36: | Line 36: | ||
float: left; | float: left; | ||
width: 40%; | width: 40%; | ||
+ | max-width: 546.4px; | ||
+ | |||
} | } | ||
Line 146: | Line 148: | ||
float: right; | float: right; | ||
width: 40%; | width: 40%; | ||
+ | max-width: 546.4px; | ||
} | } |
Revision as of 12:48, 18 July 2014
/* ------- Nav-bar ----------- */
- menu_container {
clear: both; width: 100%;
}
- clear {
clear: both; /* Vettefan varför man behöver en tom div som bara clearar, allting fuckade upp utan denna */ }
- middle_logo {
width: 20%; height: 0px; border-top: 54px solid black; float: left; }
.home_logo { position: relative; top: -150px; z-index: 2; width: 200px;
}
- menu {
background: #000; height: 46px; text-align: center; font-family: "Times New Roman", Times, serif; font-size: 16px; font-weight:bold; float: left; width: 40%; max-width: 546.4px;
}
- menu ul {
margin:0;padding:0; position:absolute; width:40%;
}
- menu ul a {
text-decoration: none;
}
- menu ul li {
list-style: none; float: left; position: relative; width: calc(225%/9);
}
- menu > ul > li {
list-style: none; float: left; position: relative; width: calc(225%/9); border-top: 5px solid #000; border-bottom: 5px solid #000;
webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
- menu > ul > li:hover {
list-style: none; float: left; position: relative; width: calc(225%/9); border-top: 5px solid #d40400; border-bottom: 5px solid #d40400; background-color: #000;
}
- menu ul li a:hover {
color: #d40400; background-color: #000; }
- menu ul li a {
background: #000; color: #fff; display: block; padding-top: 10px; padding-bottom: 10px; width:100%;
}
- menu ul ul {
padding:0; overflow: hidden; width: 100%;
}
- menu ul ul li:first-child {
margin-top: 5px; float: none; display: none; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc;' width: 100%;
}
- menu ul ul li {
float: none; display: none; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; width: 100%;
}
- menu ul ul li a {
background: #f0f0f0; color: #333; border:none; width: calc(100%/9);
}
- menu ul ul li a:hover {
background: #ccc;
}
- menu ul li a:hover,
- menu ul li:hover ul li {
display:block !important;
}
- menu ul li ul li{
width:900%; }
- menu_right {
text-align: center;
background: #000; height: 46px; font-family: "Times New Roman", Times, serif; font-size: 16px; font-weight:bold; float: right; width: 40%; max-width: 546.4px;
}
- menu_right ul {
margin:0;padding:0; position:absolute; width:40%;
}
- menu_right ul a {
text-decoration: none;
}
- menu_right ul li {
list-style: none; float: left; position: relative; width: calc(225%/9);
}
- menu_right > ul > li {
list-style: none; float: left; position: relative; width: calc(225%/9); border-top: 5px solid #000; border-bottom: 5px solid #000;
webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
- menu_right > ul > li:hover {
list-style: none; float: left; position: relative; width: calc(225%/9); border-top: 5px solid #d40400; border-bottom: 5px solid #d40400; background-color: #000;
}
- menu_right ul li a:hover {
color: #d40400; background-color: #000; }
- menu_right ul li a {
background: #000; color: #fff; display: block; padding-top: 10px; padding-bottom: 10px; width:100%;
}
- menu_right ul ul {
padding:0; overflow: hidden; width: 100%;
}
- menu_right ul ul li:first-child {
margin-top: 5px; float: none; display: none; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc;' width: 100%;
}
- menu_right ul ul li {
float: none; display: none; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; width: 100%;
}
- menu_right ul ul li a {
background: #f0f0f0; color: #333; border:none; width: calc(100%/9);
}
- menu_right ul ul li a:hover {
background: #ccc;
}
- menu_right ul li a:hover,
- menu_right ul li:hover ul li {
display:block !important;
}
- menu_right ul li ul li{
width:900%; }