Форум русской поддержки Joomla!® CMS
09.12.2016, 13:47:53 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

Войти
   
   Начало   Поиск Joomla 3.0 FAQ Joomla 2.5 FAQ Joomla 1.5 FAQ Правила форума Новости Joomla Реклама Войти Регистрация Помощь  
Страниц: [1]   Вниз
  Добавить закладку  |  Печать  
Автор

Таблица выходит за пределы области вывода контента

 (Прочитано 374 раз)
0 Пользователей и 1 Гость смотрят эту тему.
Alex-heat-shot
Захожу иногда
**

Репутация: +0/-0
Offline Offline

Сообщений: 19


« : 10.06.2016, 01:41:29 »

Здравствуйте! Таблица на сайте выходит за пределы блока, не могу понять в чем дело, помогите пожалуйста или скиньте ссылку где можно прочитать или скажите в чем проблему, вот ссылка на таблицу http://tverdyy-pereplet.ru/izgotovlenie-flaerov.html. Если не видно, нажмите на ctrl и покрутите колёсико на мышке.
Записан
Shustry
Группа развития
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #1 : 10.06.2016, 01:54:43 »

Жуть какая

Код
<table class="MsoTableGrid" style="border-collapse: collapse; mso-table-layout-alt: fixed; border: none; mso-border-alt: double windowtext 1.5pt; mso-table-overlap: never; mso-yfti-tbllook: 1184; mso-table-lspace: 9.0pt; margin-left: 6.75pt; mso-table-rspace: 9.0pt; margin-right: 6.75pt; mso-table-anchor-vertical: paragraph; mso-table-anchor-horizontal: column; mso-table-left: center; mso-table-top: .05pt; mso-padding-alt: 0cm 5.4pt 0cm 5.4pt; mso-border-insideh: 1.5pt double windowtext; mso-border-insidev: 1.5pt double windowtext;" border="1" cellspacing="0" cellpadding="0" align="left">

Вот это всё нужно заменить на

Код
<table class="MsoTableGrid">
Записан
Shustry
Группа развития
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #2 : 10.06.2016, 01:56:30 »

И далее по-содержимому, конечно, все атрибуты поудалять. Стили оформить в CSS.
Записан
Kasyanov
Осваиваюсь на форуме
***

Репутация: +5/-0
Offline Offline

Пол: Мужской
Сообщений: 55


Всё будет хорошо)


« Ответ #3 : 10.06.2016, 01:57:47 »

Если убрать отступы по бокам таблицы (margin-left и margin-right) и слегка уменьшить внутренние padding (в td), то всё входит.

А вы её из Wordа вставляли?
Записан
Alex-heat-shot
Захожу иногда
**

Репутация: +0/-0
Offline Offline

Сообщений: 19


« Ответ #4 : 10.06.2016, 02:57:08 »

Если убрать отступы по бокам таблицы (margin-left и margin-right) и слегка уменьшить внутренние padding (в td), то всё входит.

А вы её из Wordа вставляли?
да, из word и с других своих сайтов, таблица не уменьшается при изменении размера контейнера, а просто выходит за блок.
Записан
Kasyanov
Осваиваюсь на форуме
***

Репутация: +5/-0
Offline Offline

Пол: Мужской
Сообщений: 55


Всё будет хорошо)


« Ответ #5 : 10.06.2016, 03:07:49 »

Она не уменьшиться, потому что в ячейках стоят отступы, можно попробовать уменьшить шрифт.

А если по правильному, то из Wordа не надо вставлять. Word добавляет свои ненужные теги. Посмотрите на html-код - он должен быть раза в 4-5 корче.
Таблицы в HTML создавать не сложно.

Если что вот курс в помощь - http://kasyanov.info/page/free-html/
Записан
Alex-heat-shot
Захожу иногда
**

Репутация: +0/-0
Offline Offline

Сообщений: 19


« Ответ #6 : 10.06.2016, 03:11:13 »

И далее по-содержимому, конечно, все атрибуты поудалять. Стили оформить в CSS.
всё равно выходит, убрал все стили, на планшете с маленьким экраном она выходит за борт, это можно увидеть на компьютере нажав контрл и колёсико крутануть. Вот код
Код:
<div align="center">
<table class="MsoTableGrid">
<tbody>
<tr>
<td>
<p><strong><span>50шт</span></strong>
</p>
</td>
<td>
<p><strong><span>100шт</span></strong>
</p>
</td>
<td>
<p><strong><span>200шт</span></strong>
</p>
</td>
<td>
<p><strong><span>300шт</span></strong>
</p>
</td>
<td>
<p><strong><span>Размер</span></strong>
</p>
</td>
<td>
<p><strong><span>500шт</span></strong>
</p>
</td>
<td>
<p><strong><span>1000шт</span></strong>
</p>
</td>
<td>
<p><strong><span>2000шт</span></strong>
</p>
</td>
<td>
<p><strong><span>5000шт</span></strong>
</p>
</td>
</tr>
<tr>
<td>
<p><span>305р</span>
</p>
</td>
<td>
<p><span>370р</span>
</p>
</td>
<td>
<p><span>685р</span>
</p>
</td>
<td>
<p><span>998р</span>
</p>
</td>
<td>
<p><strong><span>7*10см</span></strong>
</p>
</td>
<td>
<p><span>1,100р</span>
</p>
</td>
<td>
<p><span>2,115р</span>
</p>
</td>
<td>
<p><span>4,105р</span>
</p>
</td>
<td>
<p><span>10,080р</span>
</p>
</td>
</tr>
<tr>
<td>
<p><span>365р</span>
</p>
</td>
<td>
<p><span>545р</span>
</p>
</td>
<td>
<p><span>725р</span>
</p>
</td>
<td>
<p><span>1,100р</span>
</p>
</td>
<td>
<p><strong><span>5*15см</span></strong>
</p>
</td>
<td>
<p><span>1,205р</span>
</p>
</td>
<td>
<p><span>2,235р</span>
</p>
</td>
<td>
<p><span>4,350р</span>
</p>
</td>
<td>
<p><span>10,265р</span>
</p>
</td>
</tr>
<tr>
<td>
<p><span>485р</span>
</p>
</td>
<td>
<p><span>665р</span>
</p>
</td>
<td>
<p><span>1,100р</span>
</p>
</td>
<td>
<p><span>1,630р</span>
</p>
</td>
<td>
<p><strong><span>7*15см</span></strong>
</p>
</td>
<td>
<p><span>1,840р</span>
</p>
</td>
<td>
<p><span>3,325р</span>
</p>
</td>
<td>
<p><span>6,520р</span>
</p>
</td>
<td>
<p><span>15,905р</span>
</p>
</td>
</tr>
<tr>
<td>
<p><span>615р</span>
</p>
</td>
<td>
<p><span>790р</span>
</p>
</td>
<td>
<p><span>1,570р</span>
</p>
</td>
<td>
<p><span>2,365р</span>
</p>
</td>
<td>
<p><strong><span>10*15см</span></strong>
</p>
</td>
<td>
<p><span>3,625р</span>
</p>
</td>
<td>
<p><span>5,985р</span>
</p>
</td>
<td>
<p><span>8,695р</span>
</p>
</td>
<td>
<p><span>19,925р</span>
</p>
</td>
</tr>
<tr>
<td>
<p><span>605р</span>
</p>
</td>
<td>
<p><span>735р</span>
</p>
</td>
<td>
<p><span>1,530р</span>
</p>
</td>
<td>
<p><span>2,265р</span>
</p>
</td>
<td>
<p><strong><span>7*20см</span></strong>
</p>
</td>
<td>
<p><span>3,500р</span>
</p>
</td>
<td>
<p><span>5,860р</span>
</p>
</td>
<td>
<p><span>8,575р</span>
</p>
</td>
<td>
<p><span>19,805р</span>
</p>
</td>
</tr>
<tr>
<td>
<p><span>910р</span>
</p>
</td>
<td>
<p><span>1,155р</span>
</p>
</td>
<td>
<p><span>2,295р</span>
</p>
</td>
<td>
<p><span>3,280р</span>
</p>
</td>
<td>
<p><strong><span>10*20см</span></strong>
</p>
</td>
<td>
<p><span>4,470р</span>
</p>
</td>
<td>
<p><span>6,885р</span>
</p>
</td>
<td>
<p><span>12,075р</span>
</p>
</td>
<td>
<p><span>27,170р</span>
</p>
</td>
</tr>
<tr>
<td>
<p><span>1030р</span>
</p>
</td>
<td>
<p><span>1,570р</span>
</p>
</td>
<td>
<p><span>2,965р</span>
</p>
</td>
<td>
<p><span>4,440р</span>
</p>
</td>
<td>
<p><strong><span>15*20см</span></strong>
</p>
</td>
<td>
<p><span>5,985р</span>
</p>
</td>
<td>
<p><span>8,695р</span>
</p>
</td>
<td>
<p><span>16,905р</span>
</p>
</td>
<td>
<p><span>37,435р</span>
</p>
</td>
</tr>
</tbody>
</table>
</div>
, Это дело в шаблоне, на других моих сайтах эта таблица не выходит за пределы контейнера
Записан
Shustry
Группа развития
*****

Репутация: +727/-3
Offline Offline

Пол: Мужской
Сообщений: 6667


Рисую дизайны


« Ответ #7 : 10.06.2016, 03:57:31 »

Сейчас же всё прекрасно входит. Пропишите вот так <table class="MsoTableGrid" width="100%">
Записан
Alex-heat-shot
Захожу иногда
**

Репутация: +0/-0
Offline Offline

Сообщений: 19


« Ответ #8 : 10.06.2016, 20:47:54 »

Ничего не получается, таблицы всё равно выходят за предел блока, как сделать так, что бы они уменьшали в размере подстраиваясь под блок?
Записан
AlekVolsk
Профи
********

Репутация: +317/-3
Offline Offline

Пол: Мужской
Сообщений: 6460



« Ответ #9 : 11.06.2016, 01:48:33 »

ТС, минус таблиц в том, что они всегда имеют при определенном контенте минимальную ширину, меньше которой сделать не получится, зато можно обернуть таблицу в блок с горизонтальной прокруткой, это в настоящий момент самое распространенное решение вашей проблемы
Записан
Alex-heat-shot
Захожу иногда
**

Репутация: +0/-0
Offline Offline

Сообщений: 19


« Ответ #10 : 11.06.2016, 14:45:34 »

спасибо! Ещё можно в виде картинки её выложить Smiley
Записан
fsv
Практически профи
*******

Репутация: +330/-2
Offline Offline

Пол: Мужской
Сообщений: 2246


« Ответ #11 : 11.06.2016, 15:30:30 »

Таблицы с данными в адаптивном дизайне
Responsive Data Tables: A Comprehensive List of Solutions
Записан
Страниц: [1]   Вверх
  Добавить закладку  |  Печать  
 
Перейти в:  

Powered by SMF 1.1.21 | SMF © 2006, Simple Machines

Joomlaforum.ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by Open Source Matters
the trademark holder in the United States and other countries.

LiveInternet