I have a CSS rule that makes the first letter of my titles blue, something like this : h1:first-letter { color: blue; }
This works fine, except for the fact that SharePoint sometimes adds "extra" whitespaces in front of my title strings. The character is ​.
Is there a way to fix this, maybe with jQuery that would lookup the string and delete it ?
Yes, it is rather straighforward to delete the ZERO WIDTH SPACE (U+200B) when appearing at the start of an element’s content. It can be referred to in JavaScript using the notation \u200b in a string constant or a regexp. Note: ​ is just an HTML escape for this character.
Using plain JavaScript, the operation is not substantially more verbose than using jQuery. Example:
<script>
window.onload = function () {
var h1 = document.getElementsByTagName('h1');
for(var i = 0; i < h1.length; i++)
h1[i].innerHTML = h1[i].innerHTML.replace(/^\u200b/, '');
}
</script>
The circumflex ^ at the start of the regexp matches the start of the string, so that ZERO WIDTH SPACE will be removed only when it appears at the start. It should generally not be removed elsewhere, as it may have useful effects. For example, in a string like foo/bar, a ZERO WIDTH SPACE might be inserted after the “/” to provide an optional line breaking point.
