Intuitive

!unimportant

Every line is important but some are less important than others. Everything without an !unimportant declaration is made !important by More, ensuring nothing is unintentionally overridden by pesky specific styles.

white-space: pre !unimportant ; text-wrap: none ; white-space: pre ; text-wrap: none !important

Flexibility

More provides ultimate flexibility with the ability to write one attribute per selector, per line. No more curly-braces or lazy comma-separated selectors. This means that each attribute setting only effects the exact selectors you had in mind.

h3 font-family: sans-serif !unimportant ; h3 text-wrap: none !unimportant ; h4 display: none !unimportant ; h3 { font-family: sans-serif ; text-wrap: none ; } h4 { display: none ; }

Human readable

Numbers as words

Spelling out numerals and symbols makes More a breeze to read. Banks request that you write out words in full for accuracy, More asks that you do the same. We're all human, so creating human readable code is a priority.

#footer h2 line-height: eighteen pixels !unimportant ; #footer h2 height: one-thousand-one-hundred-and-twenty-three pixels !unimportant ; #footer h2 width: automatic !unimportant ; #footer h2 { line-height: 18px ; height: 1123px ; width: auto ; }

Forget shorthand

More doesn't make assumptions about how you want things to look. By removing shorthand and requiring all attributes to be specified, you know exactly what you'll get as soon as you type it. No more surprises from getting your shorthand attributes in the wrong order!

div margin-top: ten percent !unimportant ; div margin-right: automatic !unimportant ; div margin-bottom: ten percent !unimportant ; div margin-left: automatic !unimportant ; div { margin: 10% 0 ; }

British English

Quite simply, British spellings are more universal.

section.about h3 background-position-horizontal: centre !unimportant ; section.about h3 background-position-vertical: centre !unimportant ; section.about h3 colour: grey !unimportant ; section.about h3 { background-position: center center ; color: gray ; }

Write the way you think

Colours

Graphic designers rejoice! More only allows you to specify colours in words, CMYK or Pantone values, allowing you to easily translate your print designs to the web. Pick colours directly from your Pantone swatch book without worrying about whether or not they'll be a perfect match in RGB.

h3 colour: cmyk(twenty-four, one-hundred, one-hundred, nineteen) !unimportant ; #heading background-colour: spot(PANTONE one-hundred-and-sixty-seven C) !unimportant ; h3 { color: #E8DAB8 ; } #heading { background-color: #D06F1A ; }

Fraction support

Sick of firing up your calculator every time you need to enter a decimal? More is for you! Express your decimals in easy-to-remember fractions instead.

div letter-spacing: one-half pixels !unimportant ; div margin-top: ten-and-three-quarters percent !unimportant ; div margin-right: twelve-and-fourty-five-one-hundreths percent !unimportant ; div margin-bottom: zero !unimportant ; div margin-left: twenty-two-and-five-sevenths percent !unimportant ; div { letter-spacing: 0.5px ; margin: 10.75% 12.45% 0 22.714% ; }

Help along the way

Never forget a browser prefix again! To use any CSS3 properties, More encourages you to include all browser prefixes.

div.container -moz-box-shadow-horizontal: zero !unimportant ; div.container -moz-box-shadow-vertical: zero !unimportant ; div.container -moz-box-shadow-blur: ten pixels !unimportant ; div.container -moz-box-shadow-colour: spot(PANTONE one-hundred-and-sixty-seven C) !unimportant ; div.container -webkit-box-shadow-horizontal: zero !unimportant ; div.container -webkit-box-shadow-vertical: zero !unimportant ; div.container -webkit-box-shadow-blur: ten pixels !unimportant ; div.container -webkit-box-shadow-colour: spot(PANTONE one-hundred-and-sixty-seven C) !unimportant ; div.container box-shadow-horizontal: zero !unimportant ; div.container box-shadow-vertical: zero !unimportant ; div.container box-shadow-blur: ten pixels !unimportant ; div.container box-shadow-colour: spot(PANTONE one-hundred-and-sixty-seven C) !unimportant ; div.container { -moz-box-shadow: 0 0 10px #D06F1A ; -webkit-box-shadow: 0 0 10px #D06F1A ; box-shadow: 0 0 10px #D06F1A ; }

Rather than letting your visitors have an inconsistent experience in older browsers, if you forget to include all relevant prefixes, never fear - More will remind you with a compiler error.