Jump to content

This is the support site for Andrews & Arnold Ltd, a UK Internet provider. Information on these pages is generally for our customers but may be useful to others, enjoy!

FireBrick Custom CSS: Difference between revisions

m
(clean up, typos fixed: eg → e.g.)
(One intermediate revision by the same user not shown)
To avoid having to use an external website to store your custom CSS, you can employ a <code>data:</code> URI - see [https://tools.ietf.org/html/rfc2397 RFC 2397]. Be aware that there may be a limit on the length of URIs however, and in any event see RFC 2397 section 2.
 
IIt recommendis recommended that you should not attempt to include newlines in the inline CSS of your data URI, as this may be forbidden by the URI scheme standard. Be aware of the risk of your inline CSS containing characters that are either prohibited in data URIs, illegal in quoted strings or in XML attributes. See both the RFC for the data URI scheme and also the XML standards. Just some examples of illegal characters are ", %, &, >, newlines and there are probably various others, The simple technique of including literal CSS straight, as below, is only usable if the particular fragment of CSS does not contain any problematic characters, otherwise see the next section for a general method.
 
Example,: straight, inline CSS. (exerciseExercise caution regarding prohibited characters if adapting). In the following example, any line-breaks maywhich be included for readability. These must be removed and the whole string must be entered as a single line.
 
<syntaxhighlight lang=xml><http css-url="data:text/css,@media screen{div.main,div.sidemenu div.menu a,div.topmenu,textarea{font-size:x-small}div.footer{padding:2px 10px 1px}div.footer *{vertical-align:top}}" />
</syntaxhighlight>
 
Note the presence of the comma after <code>text/css</code>. This is essential in a <code>data</data> URI.
 
=== Base64-encoded data ===
You may use base64-encoded <code>data</code> URIs for safety and complete flexibility as shown in the example below. Using base64-encoding removes any risks and problems with illegal characters completely. Note again the presence of the comma, now after the keyword 'base64<code>data</code>'. This is essential in a data URI, whether base64 is used or not.
 
If you are using any non-ASCII characters in your CSS text, unless you have already CSS backslash-hex-encoded them, which avoids the issue, your CSS should be Unicode text and you must first UTF-8-encode your CSS into a byte stream, before then base64-encoding those bytes. You ''must'' then also declare that your original CSS text was UTF-8 as in the example below.
252

edits