Bootstrap Columns issue when viewed on mobile device

Replace your menu list code with the code below: (it's your responsiblity to check the menu items and prices are correct).

You will see a handful of non-breaking spaces in the code - & nbsp; marked in red. (Make sure there is no space between the & and n - I had to leave a space otherwise the forum will delete the non-breaking space code completely.

<div class="container">

<div class="row">

<div class="col-md-6 products">

<h2>Sandwiches</h2>

<dl>

<dt>Hamburger</dt><dd>$2.30</dd>

<dt>Double Hamburger</dt><dd>$4.40</dd>

<dt>Cheeseburger <span>w/American Cheese</span></dt><dd>$2.45</dd>

<dt>Double Cheeseburger <span>w/American Cheese</span></dt><dd>$4.65</dd>

<dt>Royal Burger <span>Hamburger with lettuce, tomato & mayo</span></dt><dd>$2.60</dd>

<dt>Whoperburger <span>4oz. burger with lettuce, tomato & our own sauce</span></dt><dd>$3.85</dd>

<dt>Double Whoperburger</dt><dd>$7.25</dd>

<dt>California Veggie Patty Burger</dt><dd>$4.40</dd>

<dt>BLT w/Canadian Bacon</dt><dd>$2.75</dd>

<dt>Hot BBQ Beef Sandwich on toasted roll</dt><dd>$4.15</dd>

<dt>Pulled Pork Sandwich</dt><dd>$4.20</dd>

<dt>Rib Eye Steak Sandwich</dt><dd>$6.10</dd>

<dt>Lobster Roll</dt><dd>$7.95</dd>

<dt>Double Lobster Roll</dt><dd>$15.75</dd>

<dt>Crabmeat Roll</dt><dd>$5.75</dd>

<dt>Tuna Roll</dt><dd>$3.30</dd>

<dt>Grilled Hot Dog</dt><dd>$1.85</dd>

<dt>1/4 lb all beef Hot Dog</dt><dd>$3.30</dd>

<dt>Fresh Haddock Sandwich</dt><dd>$6.80</dd>

<dt>Fried Egg Sandwich</dt><dd>$1.75</dd>

<dt>Fried Egg and Bacon Sandwich</dt><dd>$3.80</dd>

<dt>Grilled Ham Sandwich</dt><dd>$2.55</dd>

<dt>Grilled Ham and Cheese Sandwich</dt><dd>$2.80</dd>

<dt>Grilled Cheese Sandwich</dt><dd>$1.60</dd>

<dt>Clam Cake Sandwich</dt><dd>$2.40</dd>

<dt>Crispy Chicken Breast Sandwich</dt><dd>$5.25</dd>

<dt>Grilled Chicken Breast Sandwich</dt><dd>$5.15</dd>

<dt>Chicken Salad Roll</dt><dd>$3.80</dd>

<dt>Maine Crab Cake Sandwich</dt><dd>$5.45</dd>

<dt>Lettuce & Tomato</dt><dd>extra .30¢</dd>

<dt>Maine Crab Cake Sandwich</dt><dd>extra .25¢</dd>

</dl>

<h2>Specials</h2>

<dl>

<dt>House Special...BLT w/Onion Rings</dt><dd>$5.80</dd>

<dt>Featured Chowder</dt><dd>$5.50</dd>

<dt>& nbsp;</dt><dd>& nbsp;</dd>

<dt><strong>Children's Special</strong></dt><dd>$3.40</dd>

<dt>Hot Dog Boat or Child size Hamburger or Grilled Cheese Served with golden brown fries & kiddie drink</dt><dd>& nbsp;</dd>

</dl>

</div>

<!-- end col-md-6 -->

<div class="col-md-6 products">

<h2>Baskets</h2>

<p>Served with golden french fries, and hot toasted rolls<br>

Substitute regular fries for onion rings or sweet potato fries add $1.30</p>

<dl>

<dt>Chicken Nugget Basket</dt><dd>$6.95</dd>

<dt>Crunchy Chicken Basket</dt><dd>$8.35</dd>

<dt>Southern Fried Chicken Basket</dt><dd>$8.95</dd>

<dt>Clam Cake Basket</dt><dd>$5.35</dd>

<dt>Maine Crab cake Basket</dt><dd>$11.45</dd>

<dt>Fried Shrimp Basket</dt><dd>$9.95</dd>

<dt>Fried Clam Basket whole in crumbs</dt><dd>Mkt. Price</dd>

<dt>Fried Scallop Basket</dt><dd>$14.95</dd>

<dt>Haddock Nuggets Basket</dt><dd>$8.25</dd>

<dt>Fresh Haddock Basket</dt><dd>$10.45</dd>

</dl>

<h2>Side Orders</h2>

<dl>

<dt>Golden French Fries</dt><dd>small $1.90</dd>

<dt>& nbsp;</dt><dd>large $2.10</dd>

<dt>Crisp Onion Rings</dt><dd>$3.15</dd>

<dt>Sweet Potato Fries</dt><dd>small $3.00</dd>

<dt>& nbsp;</dt><dd>large $3.35</dd>

<dt>Potato Skins <span>w/Cheddar Cheese or Sour Cream</span></dt><dd>$3.40</dd>

<dt>Mozzarella Cheese Stick</dt><dd>$5.25</dd>

<dt>Battered Green Beans <span>w/Sour Cream or Ranch</span></dt><dd>$3.75</dd>

<dt>Chicken Nuggets</dt><dd>pint $5.15</dd>

<dt>Chicken Fingers</dt><dd>$6.40</dd>

<dt>Golden Fried Clams whole in crumbs</dt><dd>pint Mkt. Price</dd>

<dt>Just Shrimp</dt><dd>$8.50</dd>

<dt>Just Haddock Nuggets</dt><dd>$7.35</dd>

<dt>1 Clam Cake</dt><dd>$2.15</dd>

<dt>1 Crab Cake</dt><dd>$5.20</dd>

<dt>Creamy Cole Slaw</dt><dd>$1.00</dd>

<dt>Side of Cheddar Cheesee</dt><dd>.85¢</dd>

<dt>Side of Sour Cream</dt><dd>.35¢</dd>

<dt>Extra Dipping Sauce</dt><dd>.25¢</dd>

</dl>

<h2>Beverages</h2>

<dl>

<dt>Coca-Cola, Diet Coke, Sprite, Diet Sprit, Root beer, Cherry</dt><dd>small $1.50</dd>

<dt>Coke, Orange, Ginger Ale, Pink Lemonade, Lemonade, Passion Fruit</dt><dd>large $1.70</dd>

<dt>Bottled Water</dt><dd>$1.80</dd>

<dt>Iced Coffee</dt><dd>small $1.10</dd>

<dt>Iced Tea</dt><dd>large $1.30</dd>

<dt>Raspberry Iced Tea</dt><dd>$X.XX</dd>

<dt>Milk</dt><dd>$1.80</dd>

<dt>Chocolate Milk</dt><dd>$1.95</dd>

<dt>Hot Coffee</dt><dd>$1.40</dd>

<dt>Hot Chocolate</dt><dd>$1.40</dd>

<dt>Hot Tea</dt><dd>$1.25</dd>

<dt>Frappes - 20oz Thick Western Frappes, Vanilla, Chocolate, Strawberry, Coffee, Banana, Black Raspberry, Mocha, Orange Cream, Blueberry</dt><dd>$3.55</dd>

</dl>

</div>

<!-- end col-md-6 -->

</div>

<!-- end row -->

</div>

<!-- end container -->

THEN USE THE CSS BELOW WHICH STYLES THE MENU LIST:

body {

font-family: helvetica, arial, sans-serif;

font-size: 14px;

font-weight: 400;

}

dl {

display: -webkit-box;

display: -ms-flexbox;

display: flex;

-webkit-box-pack: justify;

-ms-flex-pack: justify;

justify-content: space-between;

-ms-flex-wrap: wrap;

flex-wrap: wrap;

margin: 20px 25px;

}

dt {

width: 80%;

font-weight: 400;

}

dt span {

font-size: 11px;

}

dd {

width: 20%;

text-align: right;

font-weight: 400;

}

.products h2 {

margin: 0;

padding: 0;

font-family: Tahoma, Geneva, sans-serif;

font-size: 24px;

background-color: #FFFF66;

padding: 15px 25px;

font-weight: 600;

}

.products p {

margin: 20px 25px 0 25px;

padding: 0;

font-size: 11px;

}