JSFiddle - React, Tailwind, and code Playground

HTML

<div style="background-color: #98CB52; padding: 25px; border-left: 6px solid #19764A; column-count: 2; column-fill: balance;

/*-moz-column-count: 2;
   -moz-column-gap: 20px;
   -moz-column-fill: balance;
   -webkit-column-count: 2;
   -webkit-column-gap: 20px;
   -webkit-column-fill: balance;
   column-count: 2;
   column-gap: 20px;
   column-fill: balance;
   list-style-position: inside;*/
   
   
   /*-moz-column-count: 2;
   -moz-column-gap: 20px;
   -moz-column-fill: auto;
   -webkit-column-count: 2;
   -webkit-column-gap: 20px;
   -webkit-column-fill: auto;
   column-count: 2;
   column-gap: 20px;
   column-fill: auto;
   list-style-type: disc;
    columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
    list-style-position: inside;//this is important addition*/
    
        -moz-column-fill: balance;
  column-fill: balance;
  margin: 0;
  display: block;
  
">
<h2 style="color: white; text-align: center; column-span: all; ">What impact can I have?</h2>
  <h3 style="color: white;">For corporations</h3>
  <ul style="color: white;padding-left: 20px;
  

  
  
  
  
  
  
  ">
<li>Share neurodiverse practices, pitfalls and pivot points</li>
<li>Learn how to design for diversity and retain quality staff</li> <li>Promote neurodiversity at work</li>
<li>Sponsor summits or projects, gain exposure and connections</li>
<li>Liaise with other executives and leading corporations in the field</li>
  </ul>
<h3 style="color: white;">For neurodiverse individuals</h3>
    <ul style="color: white;padding-left: 20px;">
<li>Share lived experience to bolster positive social change</li>
<li>Learn employability skills</li> 
<li>Promote neurodiverse advocacy</li>
<li>Be seen and valued for your neurodiversity</li>
<li>Access beneficial resources</li>
<li>Connect with employers, researchers and the community</li>
  </ul>
  </div>