<blockquote class="text-block">
<span class="text-line">東京 Tokyo</span>
<span class="text-line">東京とは、日本の関東平野中央部の東京湾に面する世界最大級のメトロポリスであり、日本の事実上の首都</span>
<span class="text-line">現在、東京には23特別区・26市・5町・8村の基礎自治体がある</span>
 <span class="text-line">関東大震災を経験し、多くの家屋が焼け、東京市では人口の3割強が減少</span>
    <span class="text-line">1868年に江戸から名称変更</span>
    <span class="text-line">戦後には東京は目覚ましい復興を遂げ、人口は増え続け、2019年時点で、東京都で約1300万人まで、またいわゆる「首都圏」（東京圏）では3700万人まで増えた</span>
    <span class="text-line">大久保利通が「東京」と改称することを提案</span>
  </blockquote>

*{
  box-sizing:;
}
body {
  display: flex;
  font-family: Montserrat, sans-serif;
  margin: 0;
  min-height: 100vh;

}


.text-block {
  display: grid;
  grid-template-columns: max-content 1fr;
  margin: auto;
  text-transform: uppercase;
  width: ;
}

.text-line,
.text-block cite {
  display: flex;
  grid-column: 1;
  justify-content: space-between;
}

.text-block .append {
  align-self: end;
  grid-column: 2;
}

// Compiles a node list of indiviual lines inside text blocks
var lines = document.querySelectorAll(".text-line");

// Compiles a node list of elements appended to the ends of lines
var appendages = document.querySelectorAll(".append");

// Wraps each character of a string inside a `<span>` element
var wrapCharacters = function(lines) {
  return lines.forEach(function(line) {
    var characters = line.innerHTML.split("");
    var wrappedCharacters = characters
      .map(function(character) {
        if (character === " ") {
          return '<span class="text-line">&nbsp;</span>';
        }
        return '<span class="text-line">' + character + "</span>";
      })
      .join("");
    return (line.innerHTML = wrappedCharacters);
  });
};

// Sets an element’s font size based on its previous sibling
var useSiblingFontSize = function(elem) {
  elem.style.fontSize = elem.previousSibling.style.fontSize;
};

// Measures the length of each line and sets its font size accordingly
var setFontSize = function(elems) {
  return elems.forEach(function(elem) {
    if (!elem.classList.contains("append")) {
      return (elem.style.fontSize = 50 / elem.innerHTML.length + "vw");
    }
    return useSiblingFontSize(elem);
  });
};

var formatTextBlocks = function() {
  setFontSize(lines);
  setFontSize(appendages);
  wrapCharacters(lines);
};

formatTextBlocks();