title: Set horizontal scrollbar position to the rightmost
body: <p>I'm making a website where you read articles by scrolling towards right similar to the windows 10 desktop apps.</p>
  
  <p>I want to make sure that when the article loads, the page should display the end of the article, i.e.; the scrollbar must be to the rightmost and then animate the scrollbar to move to the left (i.e.; towards the beginning of the article) so that first time users know about the reading layout.</p>
  
  <p>I'm also using CSS <code>columns</code> to break down the articles into columns.
  I tried using <code>scrollLeft()</code> to set scrollbar position to the rightmost but I don't know how to calculate the width of the article spanning horizontally</p>
  
  <p>How can I do this?</p>
  
  <p><strong>HTML :</strong></p>
  
  <pre><code>&lt;div class="entry-content"&gt;
  ...
  
  ...
  
  ...
  
  &lt;/div&gt;
  </code></pre>
  
  <p>contains the article</p>
  
  <p><strong>CSS :</strong> </p>
  
  <pre><code>.entry-content {
      column-count: 3;
      max-height: 500px;
      overflow-y: hidden;
  }
  </code></pre>
  
  <p>Here is the link to the <a href="https://jsfiddle.net/9ynasean/" rel="noreferrer"><strong>fiddle</strong></a></p>