EQCSS features
General
Install and use EQCSS
At the end of the body of your HTML page
<!--[if lt IE 9]>
<script src="EQCSS-polyfills.js"></script>
<![endif]-->
<script src="EQCSS.js"></script>
and call this when you want to re-apply your style
EQCSS.apply();
Please note that this is called automatically on load, on resize, on input, on keydown/keyup, on mousedown/mouseup and when the DOM changes.
Write your own EQCSS code as if you wrote regular CSS code
in the head or the body, as inline style
<style>
/* EQCSS code */
</style>
or embedded style
<link rel=stylesheet href="code.css">
You can also use
<script type="text/eqcss"></script>
(embedded or external - for external, use a "src" attribute)
Mix regular CSS and EQCSS code
in your EQCSS style
body { ... }
@element body {
div { ... }
}
Element queries
min-width in pixels
(Use mouse)
class="minwidthpixels"
min-width in %
class="minwidthpercents"
max-width in px
class="maxwidthpixels"
max-width in %
class="maxwidthpercents"
min-height in pixels
class="minheightpixels"
min-height in %
class="minheightpercents"
max-height in px
class="maxheightpixels"
max-height in %
class="maxheightpercents"
min-characters on blocks
(Use keyboard)
class="mincharacters"
max-characters on blocks
class="maxcharacters"
min-children
class="minchildren"
max-children
class="maxchildren"
min-lines
class="minlines"
max-lines
class="maxlines"
Scoping
Scoped queries ($this)
class="scoped"
class="scoped"
Multiple conditions
class="multiple-conditions"
Scoped queries + multiple conditions
class="scoped-multiple"
class="scoped-multiple"
Parent selectors
$parent
.parent
You can also target any children of the parent:
.parent2
$root
.root
You can also target any children of the root:
.root2