"
Team:Glendale CC AZ/CSS
From 2013.igem.org
(Difference between revisions)
| Line 1: | Line 1: | ||
<html> | <html> | ||
<head> | <head> | ||
| + | <script> | ||
| + | //binding click event on li elements to having good active element | ||
| + | $("li").click(function(){ | ||
| + | $("li").removeAttr("class"); | ||
| + | $(this).addClass("active"); | ||
| + | }); | ||
| + | </script> | ||
<style> | <style> | ||
body | body | ||
| Line 10: | Line 17: | ||
{ | { | ||
margin-left: 139px; | margin-left: 139px; | ||
| - | width: | + | width: 220px; |
| - | height: | + | height: 270px; |
background-color: #fff; | background-color: #fff; | ||
| - | border: solid rgb( | + | border: solid thin rgb(223,223,223); |
padding-top: 38px; | padding-top: 38px; | ||
margin-top: 23px; | margin-top: 23px; | ||
| Line 24: | Line 31: | ||
margin: 10px 0 9px 0; | margin: 10px 0 9px 0; | ||
cursor: pointer; | cursor: pointer; | ||
| - | color: # | + | color: #000; |
transition: color .3s linear; | transition: color .3s linear; | ||
-webkit-transition: color .3s linear; | -webkit-transition: color .3s linear; | ||
| Line 44: | Line 51: | ||
.active | .active | ||
{ | { | ||
| - | background-color: rgb (190,39,0); | + | background-color: rgb(190,39,0); |
| - | background-position: left; | + | background-position: left center; |
| - | border-left: solid | + | border-left: solid 15px rgb(190,39,0); |
| - | position: | + | position: relative; |
| - | left: | + | left: -15px; |
| - | color: # | + | color: #fff; |
} | } | ||
</style> | </style> | ||
| Line 61: | Line 68: | ||
<aside> | <aside> | ||
<ul> | <ul> | ||
| - | <li class="active"><a href="">Profile Settings</a></li> | + | <li class="active"><a href="#">Profile Settings</a></li> |
<li><a href="#">Connected Networks</a></li> | <li><a href="#">Connected Networks</a></li> | ||
<li><a href="#">Email Settings</a></li> | <li><a href="#">Email Settings</a></li> | ||
Revision as of 23:16, 14 August 2013
