Team:Heidelberg/css/frontpage

From 2014.igem.org

(Difference between revisions)
Line 4: Line 4:
     background-color: #515151;
     background-color: #515151;
     text-align: center;
     text-align: center;
 +
}
 +
 +
.arrow {
 +
    position:absolute;
 +
    bottom: -20px;
 +
   
 +
   
}
}
Line 37: Line 44:
}
}
#front-nav > nav {
#front-nav > nav {
 +
  width: 100%;
 +
}
 +
 +
.arrow {
   width: 100%;
   width: 100%;
}
}
Line 43: Line 54:
   #front-nav > nav {
   #front-nav > nav {
     width: 375px;
     width: 375px;
 +
  }
 +
  .arrow {
 +
    width: 750px;
   }
   }
}
}
Line 50: Line 64:
   #front-nav > nav {
   #front-nav > nav {
     width: 485px;
     width: 485px;
 +
  }
 +
  .arrow {
 +
    width: 970px;
   }
   }
}
}
Line 56: Line 73:
   #front-nav > nav {
   #front-nav > nav {
     width: 585px;
     width: 585px;
 +
  }
 +
  .arrow {
 +
    width: 1170px;
   }
   }
}
}

Revision as of 07:41, 22 September 2014

.first { 

   margin-bottom: 0;
   height: 90vh;
   background-color: #515151;
   text-align: center;

}

.arrow { 

   position:absolute;
   bottom: -20px;

}

  1. front-nav { 
 position: fixed;
 right: 0;
 width: 50%;
 overflow: visible;
 z-index: 1030;
 margin: 33px 51px;

}

  1. front-nav > nav { 
 position:absolute;
 left:0;

}

  1. front-nav > nav > ul { 
 position:absolute;
 right:0;
 list-style-type: none;
 margin: 0;
 padding-right: 10px;

}

  1. front-nav > nav > ul > li { 
 display: inline;

}

  1. front-nav > nav > ul > li a { 
 display:inline-block;
 width:50px;

}

  1. front-nav > nav { 
 width: 100%;

}

.arrow { 

 width: 100%;

}

@media (min-width: 768px) 

 #front-nav > nav {
   width: 375px;
 }
 .arrow {
   width: 750px;
 }

}


@media (min-width: 992px) { 

 #front-nav > nav {
   width: 485px;
 }
 .arrow {
   width: 970px;
 }

}

@media (min-width: 1200px) { 

 #front-nav > nav {
   width: 585px;
 }
 .arrow {
   width: 1170px;
 }

}

Retrieved from "http://2014.igem.org/Team:Heidelberg/css/frontpage"