Interview Base Fiddle

Use this as a starting point to collaborate with candidates

by Michael LaCroix

HTML

<body>
  <section class="messages">
    <article class="message">
      <div class="user">
        <div class="avatar">
          <img class="photo" src="https://unsplash.it/200/300?random&x=0" />
        </div>
      </div>
      <div class="content">
        <div class="text">
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam faucibus vitae mi ac aliquet. Donec maximus elit in eros dapibus auctor. Vestibulum aliquam aliquam vehicula. Sed et lectus est.</p>
        </div>
      </div>
    </article>
    <article class="message">
      <div class="user">
        <div class="avatar">
          <img class="photo" src="https://unsplash.it/200/300?random&x=1" />
        </div>
      </div>
      <div class="content">
        <div class="text">
          <p>Curabitur vel nisi vitae diam pretium tincidunt. Sed eget ultricies mauris. Nam at nisl consectetur, vulputate neque ut, maximus est. Quisque suscipit ut felis accumsan consectetur. Nunc venenatis maximus tortor, ut laoreet nulla ultrices sit
            amet. Integer blandit, nunc vitae aliquam posuere, quam lorem facilisis turpis, ut faucibus purus ex quis massa. Donec sed urna non tellus porttitor aliquam. Phasellus in tellus aliquam, condimentum risus non, ornare sapien. Vestibulum vel
            venenatis nulla, at commodo sem. Nullam vel diam leo. Integer nec commodo lorem.</p>
        </div>
      </div>
    </article>
    <article class="message">
      <div class="user">
        <div class="avatar">
          <img class="photo" src="https://unsplash.it/200/300?random&x=2" />
        </div>
      </div>
      <div class="content">
        <div class="text">
          <p>Maecenas vulputate arcu sed arcu tempor sollicitudin. Pellentesque tristique dignissim tincidunt. Sed ullamcorper lacus sed felis feugiat mollis. Sed eu velit neque. Fusce viverra, felis eget dapibus pellentesque, nibh lectus placerat leo, quis
            imperdiet mauris lorem ac eros. </p>
        </div>
     ...