Line 85: | Line 85: | ||
z-index:1; | z-index:1; | ||
} | } | ||
+ | .ccsticky-nav { | ||
+ | width: 100%; | ||
+ | height: 60px; | ||
+ | position: fixed; | ||
+ | top: 0; | ||
+ | background: #139ed8; | ||
+ | } | ||
+ | |||
+ | |||
+ | .ccsticky-nav ul { | ||
+ | padding: 20px; | ||
+ | margin: 0 auto; | ||
+ | list-style: none; | ||
+ | text-align: center; | ||
+ | } | ||
+ | .ccsticky-nav ul li { | ||
+ | display: inline-block; | ||
+ | margin: 0 10px; | ||
+ | } | ||
+ | .ccsticky-nav ul li a { | ||
+ | padding: 10px 0; | ||
+ | color: #fff; | ||
+ | font-size: 1rem; | ||
+ | text-decoration: none; | ||
+ | font-weight: bold; | ||
+ | transition: all 0.2s ease; | ||
+ | } | ||
+ | .ccsticky-nav ul li a:hover { | ||
+ | color: #34495E; | ||
+ | } | ||
+ | |||
+ | section { | ||
+ | width: 100%; | ||
+ | padding: 50px; | ||
+ | background: #fff; | ||
+ | border-bottom: 1px solid #ccc; | ||
+ | height: 1024px; | ||
+ | text-align: center; | ||
+ | margin-top: 60px; | ||
+ | } | ||
</style> | </style> | ||
− | <nav> | + | <nav class="ccsticky-nav"> |
<ul> | <ul> | ||
<li><a href="https://2016.igem.org/Team:CGU_Taiwan/Home">HOME</a></li> | <li><a href="https://2016.igem.org/Team:CGU_Taiwan/Home">HOME</a></li> |
Revision as of 17:39, 1 August 2016
You can use the overflow property when you want to have better control of the layout. The overflow property specifies what happens if content overflows an element's box.fnjjskclmksjKcl;dsklcmkdms.,Cmmslakjcdisaidos'odkosp'opxsklkdgdyuisydisuyduosxuodsaud8ioaduiosiyudosudhcudosauyduosaydusocyoidsyaudiofudoshcudshchxjksyudocyiuds