Skip to content

Instantly share code, notes, and snippets.

View WebsiteStudents's full-sized avatar

WebsiteStudents WebsiteStudents

View GitHub Profile
@WebsiteStudents
WebsiteStudents / gist:4497397
Created January 9, 2013 22:04
HTML code for our 'table' project in ART 220 at NVCC.
<h1>tables with CSS</h1>
<table width="620" id="gradient-style">
<thead>
<tr>
<th height="32" colspan="2" valign="top" scope="col"></h2>Headline goes here</h2></th>
</tr>
</thead>
<tbody>
<tr>
<td width="132" valign="top"><strong>Who</strong></td>
@WebsiteStudents
WebsiteStudents / CSS code for table project
Created January 9, 2013 22:09
CSS code for the 'table' project in ART 220 at NVCC
@charset "UTF-8";
/* CSS Document */
/* ------------------
styling for the tables
------------------ */
body
{
line-height: 15px;
@WebsiteStudents
WebsiteStudents / CSS code for pagewidth DIV
Created February 5, 2013 17:24
Modification to our "pagewidth" DIV to limit the liquid-ness of our web page layout.
#pagewidth{
max-width:1000px;
min-width:800px;
margin:0 auto;
}
@WebsiteStudents
WebsiteStudents / Code to make iOS devices correctly display our styles
Last active December 12, 2015 04:38
A little "helper" code that will make iOS devices (iPhone, iPod Touch, iPad) behave nicely and display our web page as we desire. Place inside the <head> tag at the top of your website.
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
@WebsiteStudents
WebsiteStudents / Media query code for 800-pixel width
Created February 5, 2013 17:44
Media query code to change CSS for a viewport width larger than 800-pixels
<link rel="stylesheet" href="styles.css" media="screen and (min-width: 800px)" />
@WebsiteStudents
WebsiteStudents / nav-grissom
Last active December 12, 2015 09:19
Code for our Week 5 project that includes visual design for a nav button. Use this to replace the /*PASTE THE NAV-GRISSOM CODE HERE*/ comment in the CSS of our Apollo project.
.mainnav ul li.grissom {
background: url("images/nav-icon.png") no-repeat scroll 2% 50% rgba(240, 240, 220, 1);
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out; 
}
.mainnav ul li.grissom a {
background: rgba(240, 240, 220, .95);
@WebsiteStudents
WebsiteStudents / section-transform
Last active December 12, 2015 09:19
Transform code for our grissom section. Use this to replace the /* PASTE SECTION-GRISSOM TRANSFORM CODE HERE */ comment in the CSS code of our Apollo project.
.crew .crew.grissom:hover {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);
}
@WebsiteStudents
WebsiteStudents / space-background-1
Last active December 12, 2015 09:49
Our first bit of CSS for the space background. This includes the moon landscape and will replace the /*INSERT SPACE-BACKGROUND-1 CODE HERE*/ comment inside the CSS code of our document.
body {
background: url(images/apollo-moon-landscape.jpg) no-repeat fixed 0% 0;
background-size: cover;
background-color: #000;
}
@WebsiteStudents
WebsiteStudents / space-background-2
Last active December 12, 2015 09:49
The second version of our 'space background' CSS code. This replaces the /*INSERT SPACE-BACKGROUND-2 CODE HERE*/ comment in our CSS code.
body {
background: url(images/stars-tile-repeat-x.png) center top repeat-x fixed;
background-size: auto;
background-color: #000;
}
@WebsiteStudents
WebsiteStudents / space-background-3
Last active December 12, 2015 09:49
Third version of our Space Background code. This replaces the /*INSERT SPACE-BACKGROUND-3 CODE HERE*/ comment inside our CSS code.
body {
background: url(images/stars-tile-repeat-x.png) center top repeat-x fixed,
url(images/apollo-moon-landscape.jpg) no-repeat fixed 0% 0;
background-size: auto, cover;
background-color: #000;
}