Using interlinear.js

With в the spacing fails

by OjisanSeiuchi

HTML

<div class="gloss">
	в этом контексте комментаторы<br/>
	в этот контекст комментатор.<br/>
	ADP DET NOUN NOUN
</div>

CSS

.clearfix {
	clear: both;
}

.formatted-gloss {
	clear: both;
}

.gloss-error {
	color: red;
}

.gloss-label ~ .gloss-full {
	margin-left: 40px; /* This is the same width as the label plus segment margin */
}

/* This is the generalized css for when a title is used */
.gloss-label ~ .gloss-full ~ .gloss-segment {
	margin-left: 40px;
}

.gloss-segment + .gloss-segment {
	margin-left: 0px !important;
}

.gloss-label {
	width: 30px;
}

.gloss-full > .gloss-row1{
	margin-right: 15px;
}

.gloss-label a {
	text-decoration: none;
}

.gloss-merged {
	margin-left: -25px;
}

.gloss-segment {
	float: left;
	margin-right: 10px;
}


.morpheme {
	text-transform: lowercase;
	font-variant: small-caps;
	-moz-font-feature-settings: "lnum";
  -webkit-font-feature-settings: "lnum";
  font-feature-settings: "lnum";
}

.morpheme-fake-caps {
	font-size: .7em;
	text-transform: uppercase;
}

/*
Row Classes
*/
.source {
	font-weight: bold;
}

.translation {
	font-style: italic;
}

JavaScript

//Show with default settings
//Add configure method
//and then method for redisplaying the glosses.
(function(root) {

  //default options
  var options = {
    citationClass: 'citation',
    numberGlosses: true,
    prettyMergedColumns: true,
    rowClasses: {
      1: 'source',
      2: 'morphemes',
      3: 'translation',
      4: 'translation'
    },
    selector: ".gloss",
    showFormattingErrors: false,
    syntheticLanguage: false,
    useSmallCaps: true,
    useFakeSmallCaps: false
  };

  //Because goddammit IE.
  if (!Array.prototype.indexOf) {
    Array.prototype.indexOf = function(needle) {
      for (var i = 0; i < this.length; i++) {
        if (this[i] === needle) {
          return i;
        }
      }
      return -1;
    };
  }

  function gloss() {
    return {
      options: options,
      raw: {},
      layout: function(line) {
        /*
        	This regex matches in this priority: 
        		1. Words grouped by double quotes "
        		2. Words groupd by single quotes ' (this includes a word medial single quotes. so 'you're cute' would
        			match the entire string)
        		3. Single words

        		** If there is a ! in front of the line, it will match the whole line if the rest of the phrase
        			is surrounded by quotes of some sort. This is used for pulling out full lines. 

        	The regex:
        		(!\s)? -- include a ![space] at the front
        		("|'((?!\s)|^)) -- match a double quote, or a single quote that is proceeded by a space, or beg. of line
        		.+? -- any character, non-greedy
        		("|(?=').*?"|'((?=\s)|$)) -- double quote, a double quote even if there is a single quote in there, 
        										a single quote followed by a space, end of line
        		|[^\s]+  -- or characters that aren't spaces (e.g. a single word)

        */

        var preformatArray = line.match(/(!\s)?("|'((?!\s)|^)).+?("|(?=').*?"|'((?=\s)|$))|[^\s]+/g);

        if (options.useSmallCaps) {
          if...