How to create responsive list items using bootstrap theme I am using bootstrap theme. I am trying to create responsive list items. When viewing the page in tablet, laptop, desktop, I would like to see items in two columns.  When viewing the page in mobile, list should display in a single column. I entered the below code in body field but it is not working for me. I googled for some bootstrap classes but I could not find anything specific. Can you please advise how I can write the code to create responsive list items?

&lt;table&gt;
&lt;tr&gt; &lt;td class = "col-lg-6 col-md-6 col-xs-12 col-sm-6"&gt; 
&lt;ul&gt;
&lt;li&gt;Probate Problems&lt;/li&gt;
  &lt;li&gt;Title Issues&lt;/li&gt;
  &lt;li&gt;Foreclosure&lt;/li&gt;
  &lt;li&gt;Liens&lt;/li&gt;
  &lt;li&gt;Judgements&lt;/li&gt;
  &lt;li&gt;Code Violations&lt;/li&gt;
  &lt;li&gt;Job Transfer&lt;/li&gt;
&lt;/ul&gt;&lt;/td&gt;
&lt;td class = "col-lg-6 col-md-6 col-xs-12 col-sm-6"&gt;  &lt;ul&gt;
  &lt;li&gt;Mold&lt;/li&gt;
  &lt;li&gt;Divorce&lt;/li&gt;
  &lt;li&gt;Tenants Issues&lt;/li&gt;
  &lt;li&gt;Behind on Taxes&lt;/li&gt;
  &lt;li&gt;Fire Damage&lt;/li&gt;
  &lt;li&gt;Foundation Problems&lt;/li&gt;
  &lt;li&gt;Run-down Properties&lt;/li&gt;
&lt;/ul&gt;&lt;/td&gt;&lt;/tr&gt;


&lt;/table&gt;
You might need to use the Bootstrap column classes with divs instead of table elements, inside of a "row" element, which must be inside a "container" element:

&lt;div class="container"&gt;
&lt;div class="row"&gt;
  &lt;div class="col-lg-6 col-md-6 col-xs-12 col-sm-6"&gt;
    &lt;!-- Your first column goes here --&gt;
  &lt;/div&gt;
  &lt;div class="col-lg-6 col-md-6 col-xs-12 col-sm-6"&gt;
    &lt;!-- Your second column goes here --&gt;
  &lt;/div&gt;
&lt;/div&gt; &lt;!-- End row --&gt;
&lt;/div&gt; &lt;!-- End container --&gt;


There is more information about using the Bootstrap grid system in the main Bootstrap page.