Team:NRP-UEA-Norwich/Test1/css1
From 2013.igem.org
Line 1: | Line 1: | ||
- | + | @charset "utf-8"; | |
- | + | #container { | |
- | + | width: 780px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */ | |
- | + | background: #FFFFFF; | |
- | + | margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */ | |
- | + | border: 1px solid #000000; | |
+ | text-align: left; /* this overrides the text-align: center on the body element. */ | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | # | + | #floatright { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */ |
- | { | + | float: right; |
- | + | margin-left: 8px; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | #floatleft { /* this class can be used to float an element left in your page */ | |
- | # | + | float: left; |
- | { | + | margin-right: 8px; |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | #clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */ | |
- | + | clear:both; | |
- | + | height:0; | |
- | + | font-size: 1px; | |
+ | line-height: 0px; | ||
} | } | ||
- | # | + | #logo { |
- | + | height: 82px; | |
- | + | width: 104px; | |
+ | position: absolute; | ||
+ | background-color: #FFFFFF; | ||
} | } | ||
- | # | + | #header { |
- | + | height: 82px; | |
- | + | width: 640px; | |
+ | margin-left: 120px; | ||
+ | background-color: #00CC00; | ||
} | } | ||
- | + | #title { | |
- | # | + | font-family: "Lucida Calligraphy"; |
- | { | + | font-size: 46px; |
- | + | text-align: center; | |
- | + | height: 60px; | |
- | + | margin-top: 10px; | |
- | + | padding: 0px; | |
- | + | ||
} | } | ||
- | # | + | #main_content { |
- | { | + | font-family: "Lucida Sans"; |
- | + | font-size: 16px; | |
+ | color: 4e4241; | ||
+ | height: 430px; | ||
+ | width: 280px; | ||
+ | margin-left: 95px; | ||
+ | margin-top: 40px; | ||
+ | letter-spacing: normal; | ||
+ | text-align: center; | ||
+ | word-spacing: normal; | ||
+ | padding: 0px; | ||
} | } | ||
- | # | + | #home_btn { |
- | { | + | height: 49px; |
- | + | width: 107px; | |
- | + | margin-top: 25px; | |
- | + | margin-right: 0px; | |
- | + | margin-bottom: 0px; | |
- | + | margin-left: 95px; | |
+ | border: 6px; | ||
} | } | ||
- | # | + | #artists_btn { |
- | { | + | height: 49px; |
- | + | width: 107px; | |
- | + | margin-left: 252px; | |
- | + | margin-top: -49px; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | # | + | #gallery_btn { |
- | { | + | height: 49px; |
- | + | width: 107px; | |
- | + | margin-top: -49px; | |
- | + | margin-left: 409px; | |
- | + | ||
} | } | ||
- | # | + | #contact_btn { |
- | { | + | height: 49px; |
- | + | width: 107px; | |
- | + | margin-top: -49px; | |
- | + | margin-left: 566px; | |
- | + | ||
- | + | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | # | + | #image_art { |
- | + | height: 205px; | |
- | + | width: 180px; | |
- | + | margin-left: 475px; | |
- | + | position: absolute; | |
- | + | margin-top: 80px; | |
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | body { | |
- | { | + | background: #4e4241; |
- | + | margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */ | |
- | + | padding: 0; | |
- | + | text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */ | |
- | + | color: #4e4241; | |
- | + | font-family: Verdana, Arial, Helvetica, sans-serif; | |
- | + | font-size: 100%; | |
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
+ | #artwork { | ||
+ | height: 100px; | ||
+ | width: 180px; | ||
+ | margin-left: 475px; | ||
+ | margin-top: 350px; | ||
+ | position: absolute; | ||
} | } |
Revision as of 13:28, 16 July 2013
@charset "utf-8";
- container {
width: 780px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */ background: #FFFFFF; margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */ border: 1px solid #000000; text-align: left; /* this overrides the text-align: center on the body element. */ }
- floatright { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
float: right; margin-left: 8px; }
- floatleft { /* this class can be used to float an element left in your page */
float: left; margin-right: 8px; }
- clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
clear:both;
height:0; font-size: 1px; line-height: 0px;
}
- logo {
height: 82px; width: 104px; position: absolute; background-color: #FFFFFF; }
- header {
height: 82px; width: 640px; margin-left: 120px; background-color: #00CC00; }
- title {
font-family: "Lucida Calligraphy"; font-size: 46px; text-align: center; height: 60px; margin-top: 10px; padding: 0px; }
- main_content {
font-family: "Lucida Sans"; font-size: 16px; color: 4e4241; height: 430px; width: 280px; margin-left: 95px; margin-top: 40px; letter-spacing: normal; text-align: center; word-spacing: normal; padding: 0px; }
- home_btn {
height: 49px; width: 107px; margin-top: 25px; margin-right: 0px; margin-bottom: 0px; margin-left: 95px;
border: 6px;
}
- artists_btn {
height: 49px; width: 107px; margin-left: 252px; margin-top: -49px; }
- gallery_btn {
height: 49px; width: 107px; margin-top: -49px; margin-left: 409px; }
- contact_btn {
height: 49px; width: 107px; margin-top: -49px; margin-left: 566px; }
- image_art {
height: 205px; width: 180px; margin-left: 475px; position: absolute; margin-top: 80px; }
body {
background: #4e4241;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #4e4241;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
}
- artwork {
height: 100px; width: 180px; margin-left: 475px; margin-top: 350px; position: absolute; }