CSS для ul.li. не влезает текст.
 

Есть страничка по адресу http://sale.srfhm.ru/css_bug/

В ней есть табличка сделанная на UL LI тегах, и вот в ячейке Описание, где выводится описание для типа питания не влезает весь текст и остальную часть не видно, скрывается стилем - overflow: hidden



Пробовал убрать этот overflow, тогда вообще таблица вся разъезжается...



В верстке не особо силен, подскажите пожалуйста где поправить что, чтобы текст нормально влез и весь отображался... Пробовал уже по всякому, всю голову сломал!



Заранее огромное Спасибо!

Вы используете элемент UL, который предназначен для списков. У вас получился список, а нужна таблица.

<table class="pitanie_table">
  <tr>
    <th>Питание</th>
    <th>Стоимость</th>
    <th>Описание</th>
  </tr>
  <tr>
    <td>Меню 1</td>
    <td>130 руб.</td>
    <td>Булочка «Летная» с кунжутом; Нарезка овощная; Нарезка мясная; Нарезка сырная; Майонез (сашет); Кондитерское изделие; Сливки; Сахар; Чай;</td>
  </tr>
  <tr>
    <td>Меню 2</td>
    <td>115 руб.</td>
    <td>Гамбургер; Сливки; Сахар; Чай; Шоколад;</td>
</tr>
</table>
<style>
.pitanie_table {
  border-collapse: collapse;
  max-width: 40em;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.pitanie_table td, .pitanie_table th {
  border: 1px solid #ddd;
  padding: .5em;
}
</style>

Здравствуйте. А как Вы умудрились таблицу с помощью тегов <ul> и <li> сделать, если не секрет? А, в стилях просто задали border: border 1px solid #ddd? Умно. Но действительно. Таблицы же есть.