prodio
Version:
Simplified project management
113 lines (97 loc) • 5.08 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Sticky footer</title>
<meta name="description" content="">
<meta name="author" content="ink, cookbook, recipes">
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<!-- Place favicon.ico and apple-touch-icon(s) here -->
<link rel="shortcut icon" href="../img/favicon.ico">
<link rel="apple-touch-icon-precomposed" href="../img/touch-icon.57.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="../img/touch-icon.72.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="../img/touch-icon.114.png">
<link rel="apple-touch-startup-image" href="../img/splash.320x460.png" media="screen and (min-device-width: 200px) and (max-device-width: 320px) and (orientation:portrait)">
<link rel="apple-touch-startup-image" href="../img/splash.768x1004.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)">
<link rel="apple-touch-startup-image" href="../img/splash.1024x748.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)">
<!-- load inks CSS -->
<link rel="stylesheet" type="text/css" href="../css/ink-flex.min.css">
<link rel="stylesheet" type="text/css" href="../css/font-awesome.min.css">
<!-- load inks CSS for IE8 -->
<!--[if lt IE 9 ]>
<link rel="stylesheet" href="../css/ink-ie.min.css" type="text/css" media="screen" title="no title" charset="utf-8">
<![endif]-->
<!-- test browser flexbox support and load legacy grid if unsupported -->
<script type="text/javascript" src="../js/modernizr.js"></script>
<script type="text/javascript">
Modernizr.load({
test: Modernizr.flexbox,
nope : '../css/ink-legacy.min.css'
});
</script>
<!-- load inks javascript files -->
<script type="text/javascript" src="../js/holder.js"></script>
<script type="text/javascript" src="../js/ink-all.min.js"></script>
<script type="text/javascript" src="../js/autoload.js"></script>
<style type="text/css">
html, body {
height: 100%;
background: #f0f0f0;
}
.wrap {
min-height: 100%;
height: auto ;
height: 100%;
margin: 0 auto -120px;
overflow: auto;
}
.push, footer {
height: 120px;
margin-top: 0;
}
footer {
background: #ccc;
border: 0;
}
footer * {
line-height: inherit;
}
.top-menu {
background: #1a1a1a;
}
</style>
</head>
<body>
<div class="wrap">
<div class="top-menu">
<nav class="ink-navigation ink-grid">
<ul class="menu horizontal black">
<li class="active"><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
<li><a href="#">item</a></li>
</ul>
</nav>
</div>
<div class="ink-grid vertical-space">
<h1>heading</h1>
<p>And though of all men the moody captain of the Pequod was the least given to that sort of shallowest assumption; and though the only homage he ever exacted, was implicit, instantaneous obedience; though he required no man to remove the shoes from his feet ere stepping upon the quarter-deck; and though there were times when, owing to peculiar circumstances connected with events hereafter to be detailed, he addressed them in unusual terms, whether of condescension or IN TERROREM, or otherwise; yet even Captain Ahab was by no means unobservant of the paramount forms and usages of the sea.</p>
</div>
<div class="push"></div>
</div>
<footer class="clearfix">
<div class="ink-grid">
<ul class="unstyled inline half-vertical-space">
<li class="active"><a href="#">About</a></li>
<li><a href="#">Sitemap</a></li>
<li><a href="#">Contacts</a></li>
</ul>
<p class="note">Identification of the owner of the copyright, either by name, abbreviation, or other designation by which it is generally known.</p>
</div>
</footer>
</body>
</html>