Icontem

File: Measurer.css

Recommend this page to a friend!
  Classes of Mark Rolich  >  JS Measure  >  Measurer.css  >  Download  
File: Measurer.css
Role: Auxiliary data
Content type: text/plain
Description: example css styles
Class: JS Measure
Measure page area width and height interactively
Author: By
Last change:
Date: 6 years ago
Size: 1,705 bytes
 

Contents

Class file image Download
/* General layout */

html, body {
    font: 16px Arial;
    text-align: center;
    margin: 0;
    padding: 0;
    text-align: center;
    width: 100%
}

html {
    height: 100%;
    overflow: hidden
}

body {
    background: #f0f9ff;
}

h1 {
    margin: 30px 0 0;
    padding: 0;
    width: 100%;
    text-align: center;
    color: #777;
}

p {
    margin: 20px 0 0;
    padding: 0;
    width: 100%;
    text-align: center;
    color: #777;
}

div {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

ul {
	width: 600px;
	margin: 25px auto;
	text-align: left;
    color: #555	
}

li {
	margin: 10px 0;
}

li strong {
    display: inline-block;
    padding: 5px;
    background-color: green;
    color: #fff;
    border-radius: 5px;
    font-size: 16px;
    font-weight: bold;
    line-height: 12px;
    text-align: center;
}

.btn {
	background-color: orange;
	color: #fff;
	padding: 10px;
	text-decoration: none;
	font-weight: bold;
    border-radius: 5px
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 120px;
    bottom: 0;
    background-color: rgba(120, 120, 120, 0.7);
    text-align: left;
    padding-top: 3px
}

.footer p {
    padding: 0 0 0 20px;
    margin: 5px 0 0;
    line-height: 24px;
    display: block;
    width: auto;
    text-shadow: 1px 1px 0px #333;
}

.footer p,
.footer a {
    text-align: left;
    color: #fff
}

.footer p span {
    display: inline-block;
    width: 100px
}

.footer a {
    display: inline-block;
    background-color: #2B54BF;
    color: #fff;
    font-weight: bold;
    border-radius: 5px;
    padding: 0 5px;
    text-shadow: 1px 1px 0px #000;
    text-decoration: none
}