Skip to content

Instantly share code, notes, and snippets.

@laurenlibrarian

laurenlibrarian/2015 Ray Howard Website

Last active May 7, 2019 17:36
Show Gist options
  • Save laurenlibrarian/e1ec5f7ae5c4fb87eaa5 to your computer and use it in GitHub Desktop.
Save laurenlibrarian/e1ec5f7ae5c4fb87eaa5 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
2015 Ray Howard Website
<!DOCTYPE html>
<html>
<head>
<div id="wrapper">
<div id="banner">
<img src="http://lgimages.s3.amazonaws.com/data/imagemanager/109058/librarybanner2015.jpg">
</div>
<div id="campus"> <h1 id="overlay">Welcome to your library</h1> <img src="http://s14.postimg.org/vfvtxzjvl/cropped_Library2.jpg"> </div>
<div id="navbar2"> <table id="hihi"><tr><td>Search <div id="search"></div> <td id="butt">Reserves</td><td></td><td id="butt"> E&#8209;books </td><td></td><td id="butt">Databases</td><td></td><td id="butt"> Guides </td> <td></td><td id="butt">About </td><td></td></tr></table></div>
<!--<div id="navbar">
<ul>
<li class="onebutton">Search</li><li class="button">E-books</li><li class="button">Databases</li><li class="button">About</li></ul>
</div>-->
</div>
<title>My Website</title>
<meta charset="UTF-8" />
<style type="text/css">
* { font-family: Verdana, Arial, sans-serif; }
h1 { font-size: 15pt; }
p { font-size: 10pt; }
#campus {border-bottom: #cccccc solid 5px;}
#overlay {width: 400px; text-align: center; position: absolute; display: block; background-color: #336666; top: 175px; font-size: x-large; color: white; padding: 5px;}
#navbar {display: inline-block; width: 985px; margin: auto;}
ul {display: block; margin-left:auto;}
li {display: inline-block; text-align: center; }
.button {width: 20%; height: 95px; background-color: #669999; color: white; border: white solid 1px;}
.onebutton {width: 39%; height: 95px; background-color: #669999; color: white; border: white solid 1px;}
#wrapper {margin: auto; width: 985px; }
body {background-color: #CCCCCC;}
#left {width: 25%; display: inline-block; height: 600px; clear: both; background-color: black; }
#center {width: 43%; display: inline-block; height: 600px; clear: both; background-color: blue;}
#right {width: 30%; display: inline-block; height: 600px; clear: both; background-color: pink; }
#columns {margin: auto; width: 985px; height: 600px;}
#navbar2 {width: 985px; height: 100px; background-color: #669999; color: white; position: absolute; }
#hihi {color: white; text-align: center; font-size: 14; vertical-align: middle; margin: auto; position: relative; top: 10px; }
#hihi tr td {width: 35px; height: 75px; font-family: garamond; font-size: 150%; }
#butt {background-color: white; color: #669999; padding: 10px; border-radius: 5px; font-family: garamond; }
#hihi tr td:nth-child(1) {width: 300px; vertical-align: middle;}
#search { float: left; width:200px; height: 35px; background-color: white; border-radius: 10px; position: relative; }
</style>
</head>
<body>
<div id="columns">
<div id="left"></div>
<div id="center"></div>
<div id="right"></div>
</div>
<h1>Your Page</h1>
<p>Your content.</p>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment