Desktop design

Mobile design

Results summary component

<div class="result">
        <h4>Your Result</h4>
        <div>
          <h1>76</h1>
          <p>of 100</p>
        </div>
        <h3>Great</h3>
        <p>
          You scored higher than 65% of the people who have taken these tests.
        </p>
      </div>

<li class="reaction">
            <img src="images/icon-reaction.svg">
            <h4>Reaction</h4>
            <p><span>80</span> / 100</p>
          </li>

<li class="Memory">
            <img src="images/icon-memory.svg">
            <h4>Memory</h4>
            <p><span>92</span> / 100</p>
          </li>

<li class="verbal">
            <img src="images/icon-verbal.svg"> 
            <h4>Verbal</h4>
            <p><span>61</span> / 100</p>
          </li>

<li class="visual">
            <img src="images/icon-visual.svg">
            <h4>Visual</h4>
            <p><span>72</span> / 100</p>
          </li>

Please log in to post a comment

Community feedback

Results summary component using CSS Flex. Used only css and html.

Solution retrospective

Please log in to post a comment

Community feedback

Join our Discord community