Difference between revisions of "Template:Tokyo Tech"

Line 79: Line 79:
 
float: left;
 
float: left;
 
}
 
}
−
 
+
.clear{
 +
clear: both;
 +
}
  
 
/****************************** About Menu ************************************/
 
/****************************** About Menu ************************************/
 
#menu_list_division{
 
#menu_list_division{
−
width: 90%;
+
width: 100%;
−
min-width: 880px;
+
     margin: 0;
−
max-width: 1100px;
+
−
     margin: 0 auto;
+
 
     margin-bottom: 40px;
 
     margin-bottom: 40px;
−
}
 
−
#menu_list_divison ul.menu_list_class{
 
−
*zoom: 1;
 
−
list-style: none;
 
−
width: 100%;
 
−
min-width: 880px;
 
−
max-width: 1100px;
 
−
margin: 5px auto 30px;
 
−
padding: 0 auto;
 
−
display: table;
 
−
box-sizing: border-box;
 
 
}
 
}
 
.menu_list_class:before, .menu_list_class:after{
 
.menu_list_class:before, .menu_list_class:after{
Line 107: Line 96:
 
clear: both;
 
clear: both;
 
}
 
}
−
.menu_list_class li{
+
 
 +
#menu_list{
 +
*zoom: 1;
 +
list-style: none;
 +
width: 100%;
 +
margin: 0;
 +
padding: 0;
 +
padding-left: 0;
 +
display: table;
 +
box-sizing: border-box;
 +
}
 +
#menu_list li{
 
display: table-cell;
 
display: table-cell;
 
position: relative;
 
position: relative;
−
margin: 0 5%;
+
margin: 0;
−
padding: 0 1%;
+
padding: 0;
 +
// width: 11%;
 
text-align: center;
 
text-align: center;
 +
vertical-align: center;
 
}
 
}
−
 
+
/*
−
#menu_list_class li:nth-child(5n+1){
+
#menu_list li:nth-child(9n){
−
margin: 0 1% 0 0;
+
margin: 0 0.5% 0 0;
−
}
+
−
.menu_list1 li:nth-child(5n){
+
−
margin: 0 0 0 1%;
+
 
}
 
}
−
.menu_list2 li:nth-child(4n){
+
#menu_list li:nth-child(9n+1){
−
margin: 0 0 0 1%;
+
margin: 0 0 0 0.5%;
 
}
 
}
−
.menu_list_class li a{
+
*/
 +
#menu_list li a{
 
display: block;
 
display: block;
 
box-sizing: border-box;
 
box-sizing: border-box;
 
height: 48px;
 
height: 48px;
−
margin: 0;
+
padding: 15px 5px;
−
padding: 15px 30px 11px;
+
 
color: #583612;
 
color: #583612;
 
font-size: 18px;
 
font-size: 18px;
Line 138: Line 137:
 
background-color:rgba(255,255,255,0.5)
 
background-color:rgba(255,255,255,0.5)
 
}
 
}
−
.menu_list_class li a:hover{
+
 
 +
#human_practice_menu{
 +
// width: 12%;
 +
}
 +
 
 +
#menu_list li a:hover{
 
background: #583612;
 
background: #583612;
 
color: #ffffff;
 
color: #ffffff;
 
}
 
}
−
.menu_list_class li:hover ul li{
+
#menu_list li:hover ul li{
 
overflow: visible;
 
overflow: visible;
 
height: 48px;
 
height: 48px;
Line 148: Line 152:
 
}
 
}
 
/*
 
/*
−
.menu_list_class li a span{
+
#menu_list li a span{
 
position: absolute;
 
position: absolute;
 
top: 50%;
 
top: 50%;
Line 156: Line 160:
 
*/
 
*/
  
−
#menu_list_division ul.drop_menu{
+
#menu_list .drop_menu{
 
list-style: none;
 
list-style: none;
−
// left: -100%;
 
 
left: 0;
 
left: 0;
 
z-index: 9999;
 
z-index: 9999;
−
// top: 95%;
 
 
top: 100%;
 
top: 100%;
 
margin: 0;
 
margin: 0;
 
padding: 0;
 
padding: 0;
 
}
 
}
−
.drop_menu li{
+
#menu_list .drop_menu li{
 
display: block;
 
display: block;
 
width: 100%;
 
width: 100%;
Line 175: Line 177:
 
padding: 0;
 
padding: 0;
 
}
 
}
−
.drop_menu li a{
+
#menu_list .drop_menu li a{
 
display: block;
 
display: block;
 
box-sizing: border-box;
 
box-sizing: border-box;
Line 186: Line 188:
 
text-align: left;
 
text-align: left;
 
}
 
}
−
.drop_menu li:hover > a{
+
#menu_list .drop_menu li:hover > a{
 
// background: #0d4f78;
 
// background: #0d4f78;
 
}
 
}
−
.drop_menu li a:hover{
+
#menu_list .drop_menu li a:hover{
 
background: #583612;
 
background: #583612;
 
color: #ffffff;
 
color: #ffffff;
 
}
 
}
  
−
.drop_menu li:hover ul li{
+
#menu_list .drop_menu li:hover ul li{
 
overflow: visible;
 
overflow: visible;
 
height: 48px;
 
height: 48px;
 
// background: #186b91;
 
// background: #186b91;
 
}
 
}
−
#menu_list_division ul.second_level_menu{
+
#menu_list .second_level_menu{
 
list-style: none;
 
list-style: none;
 
position: absolute;
 
position: absolute;
Line 213: Line 215:
 
transition: all .5s ease;
 
transition: all .5s ease;
 
}
 
}
−
.second_level_menu li{
+
#menu_list .second_level_menu li{
 
display: inline-block;
 
display: inline-block;
 
position: relative;
 
position: relative;
Line 220: Line 222:
 
padding: 0;
 
padding: 0;
 
}
 
}
−
.second_level_menu li a{
+
#menu_list .second_level_menu li a{
 
display: inline-block;
 
display: inline-block;
 
box-sizing: border-box;
 
box-sizing: border-box;
Line 233: Line 235:
 
}
 
}
  
−
.menu_list_class li:hover ul li ul{
+
#menu_list .menu_list_class li:hover ul li ul{
 
overflow: hidden;
 
overflow: hidden;
 
width: 0%;
 
width: 0%;
 
}
 
}
−
.menu_list_class li ul li:hover ul{
+
#menu_list .menu_list_class li ul li:hover ul{
 
overflow: visible;
 
overflow: visible;
 
width: 100%;
 
width: 100%;
 
}
 
}
−
.menu_list_class li ul li:hover ul li{
+
#menu_list .menu_list_class li ul li:hover ul li{
 
overflow: visible;
 
overflow: visible;
 
width: 100%;
 
width: 100%;
Line 264: Line 266:
 
/********************************* For smart phone ***********************************/
 
/********************************* For smart phone ***********************************/
 
/*
 
/*
−
@media screen and (max-width: 360px){
+
@media screen and (max-width: 640px){
 
#menu_list_division{
 
#menu_list_division{
 
//overflow: hidden;
 
//overflow: hidden;
Line 348: Line 350:
 
<div class="clear"></div><!-- /clear -->
 
<div class="clear"></div><!-- /clear -->
 
<div id="menu_list_division">
 
<div id="menu_list_division">
−
<ul id="menu_list1" class="menu_list_class">
+
<ul id="menu_list" class="menu_list_class">
 
<li><a href="https://2016.igem.org/Team:Tokyo_Tech"><span>Home</span></a></li>
 
<li><a href="https://2016.igem.org/Team:Tokyo_Tech"><span>Home</span></a></li>
 
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Project">Project</a></li>
 
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Project">Project</a></li>
 +
<li><a href="jhttps://2016.igem.org/Team:Tokyo_Tech/Medal">Achievements</a></li>
 
<li><a href="javascript:void(0);">Experiment</a>
 
<li><a href="javascript:void(0);">Experiment</a>
 
<ul id="experiment_list" class="drop_menu">
 
<ul id="experiment_list" class="drop_menu">
Line 381: Line 384:
 
</li>
 
</li>
 
</ul><!-- /experiment_list -->
 
</ul><!-- /experiment_list -->
 +
</li>
 +
<li id="human_practice_menu"><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices">Human Practices</a>
 +
<ul id="human_practices_list" class="drop_menu">
 +
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#overview">Human Practices Overview</a></li>
 +
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#3E">HP 3E</a></li>
 +
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#Policy_and_Practices">HP Policy and Practices</a></li>
 +
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#Snow_White_Varieties">HP Snow White Varieties</a></li>
 +
</ul><!-- /human_practices_list -->
 
</li>
 
</li>
 
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Model">Model</a></li>
 
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Model">Model</a></li>
Line 389: Line 400:
 
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Composite_Part">Composite Parts</a></li>
 
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Composite_Part">Composite Parts</a></li>
 
</ul><!-- /parts_list -->
 
</ul><!-- /parts_list -->
−
</li>
 
−
</ul><!-- /menu_list1 -->
 
−
<ul id="menu_list2" class="menu_list_class">
 
−
<li><a href="javascipt:void(0);">Achievements</a>
 
−
<ul id="achivements_list" class="drop_menu">
 
−
<li class="drop_list"><a href="https://2016.igem.org/Team:Tokyo_Tech/Medal">Medal Requirements</a></li>
 
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Processing">Best Information Processing</a></li>
 
−
</ul><!-- /achivements_list -->
 
−
</li>
 
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices">Human Practices</a>
 
−
<ul id="human_practices_list" class="drop_menu">
 
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#overview">Human Practices Overview</a></li>
 
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#3E">HP 3E</a></li>
 
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#Policy_and_Practices">HP Policy and Practices</a></li>
 
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#Snow_White_Varieties">HP Snow White Varieties</a></li>
 
−
</ul><!-- /human_practices_list -->
 
 
</li>
 
</li>
 
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Collaborations">Collaborations</a>
 
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Collaborations">Collaborations</a>
Line 419: Line 414:
 
</ul><!-- /about_us_list -->
 
</ul><!-- /about_us_list -->
 
</li>
 
</li>
−
</ul><!-- /menu_list2 -->
+
</ul><!-- /menu_list -->
 
</div><!-- /menu_list_division -->
 
</div><!-- /menu_list_division -->
  

Revision as of 08:02, 17 October 2016