Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.86/218: Рейтинг темы: голосов - 218, средняя оценка - 4.86
16 / 16 / 9
Регистрация: 16.03.2012
Сообщений: 437

Как разместить две таблицы рядом ?

09.04.2014, 21:11. Показов 42933. Ответов 5
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Добрый вечер!

Как сделать чтобы 2 таблицы были рядом друг с другом ?

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<table style="float: left;">
            <tr>
                <td style="width: 100px; height: 100px; background: url(../images/ico1.png) no-repeat left">
                </td>
                <td>
                    <p>Более 10 лет опыта в сфере коммерческого и налогового права</p>
                </td>
            </tr>
            <tr>
                <td style="width: 100px; height: 100px; background: url(../images/ico1.png) no-repeat left">
                </td>
                <td>
                    <p>Мы помогаем Вам найти оптимальное решение для Вашего бизнеса</p>
                </td>
            </tr>
            <tr>
                <td style="width: 100px; height: 100px; background: url(../images/ico1.png) no-repeat left">
                </td>
                <td>
                    <p>Мы оказываем полный комплекс услуг в одном месте</p>
                </td>
            </tr>
        </table>
 
<div style="float:left;">
        <table style="float: left;">
            <tr>
                <td style="width: 100px; height: 100px; background: url(../images/ico1.png) no-repeat left">
                </td>
                <td>
                    <p>У нас работают только высококвалифицированные специалисты</p>
                </td>
            </tr>
            <tr>
                <td style="width: 100px; height: 100px; background: url(../images/ico1.png) no-repeat left">
                </td>
                <td>
                    <p>Мы говорим на русском, латышском, английском языках</p>
                </td>
            </tr>
            <tr>
                <td style="width: 100px; height: 100px; background: url(../images/ico1.png) no-repeat left">
                </td>
                <td>
                    <p>Мы соблюдаем строгую конфиденциальность*полученной*информации</p>
                </td>
 
                <td style="width: 100px; height: 100px; background: url(../images/ico1.png) no-repeat left">
                </td>
                <td>
                    <p>Мы даем гарантию результата - 100 %</p>
                </td>
            </tr>
        </table>
    </div>
</div>
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
09.04.2014, 21:11
Ответы с готовыми решениями:

Разместить рядом 6 блоков
Задача следующая. Есть 6 блоков одинакового размера в рх. При полном масштабе это по 3 в два ряда. Как сделать так, чтоб при уменшении...

Как разместить картинки в две строки на всю ширину экрана
Всем привет! Помогите с форматированием. Как разместить изображения в section#cuisines в два ряда на всю ширину экрана без промежутков,...

Разместить кнопку рядом с текстом
Увеличиваю шрифт текста кнопка тоже увеличивается. Надо обязательно кнопку разместить рядом с текстом. &lt;style&gt; h1 { ...

5
8 / 8 / 10
Регистрация: 11.04.2012
Сообщений: 611
09.04.2014, 23:40
не понятно зачем вторую таблицу засунул в div.
Попробуй
HTML5
1
<div style="float:left;"></div>
данный блок убрать, и во 2 таблицы убери style="float: left;".
По сути дела вторая таблица должна встать рядом с 1
1
16 / 16 / 9
Регистрация: 16.03.2012
Сообщений: 437
09.04.2014, 23:54  [ТС]
Divil, сделал как Вы написали и ещё добавил ширину для каждой таблицы. И всё получилось. Спасибо!
0
-99 / 1 / 0
Регистрация: 28.10.2015
Сообщений: 8
17.02.2019, 16:21
А конечный пример в студию!?

Добавлено через 1 минуту
Цитата Сообщение от SlashX6 Посмотреть сообщение
Divil, сделал как Вы написали и ещё добавил ширину для каждой таблицы. И всё получилось. Спасибо!

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<div style="float:left;">
две таблицы следующие друг за другом
<table width="275" border="1" style="float: left;">
            <tr>
                <td>1</td>
                <td>Более 10 лет опыта в сфере коммерческого и налогового права</td>
            </tr>
            <tr>
                <td>1</td>
                <td>Мы помогаем Вам найти оптимальное решение для Вашего бизнеса</td>
            </tr>
            <tr>
                <td>1</td>
                <td>Мы оказываем полный комплекс услуг в одном месте</td>
            </tr>
        </table>
 
<table width="275" border="1">
            <tr>
                <td>1</td>
                <td>Более 10 лет опыта в сфере коммерческого и налогового права</td>
            </tr>
            <tr>
                <td>1</td>
                <td>Мы помогаем Вам найти оптимальное решение для Вашего бизнеса</td>
            </tr>
            <tr>
                <td>1</td>
                <td>Мы оказываем полный комплекс услуг в одном месте</td>
            </tr>
        </table>
</div>
так у меня получилось

Добавлено через 27 минут
вопрос в продолжение... если ширина дива изменяема в зависимости от размеров окна (например 100%), то как сделать чтобы таблицы третья четвертая и др если не помещаются, то падали бы вниз автоматом на другую строку.?
0
17.02.2019, 16:43

Не по теме:

LJ_exe, зачем поднимать тему 2014 года? Если у вас есть похожий вопрос, создайте отдельную тему.

0
-99 / 1 / 0
Регистрация: 28.10.2015
Сообщений: 8
17.02.2019, 17:04
Согласен, но тема родная прям-прям продолжение наклевывается.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
17.02.2019, 17:04
Помогаю со студенческими работами здесь

Как разместить кнопочку поверх таблицы
Таблица наезжает кнопочку при прокрутке. Кроме того, не работает :hover при получении фокуса от мышки Что не так в CSS не пойму ...

Как разместить текст и кнопки справа от таблицы
Когда в css пишу float: right; кнопки не работают.

Как разместить таблицы в нужных нам местах экрана
Маленький вопросик)))Как разместить таблицы в нужных нам местах экрана???

Как разместить текст и кнопки, справа от таблицы?) (Таблица находится по середине)
&lt;html&gt; &lt;head&gt; &lt;style&gt; &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;center&gt;&lt;table&gt; &lt;tr&gt; &lt;td&gt;&lt;/td&gt; ...

Не могу форму разместить в две ячейки
Здравствуйте, помогите разместить в две ячейки, почему то создаются четыре &lt;p&gt; &lt;form action=&quot;form_action.php&quot;...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
Новые блоги и статьи
Символьное дифференцирование
igorrr37 13.02.2026
/ * Программа принимает математическое выражение в виде строки и выдаёт его производную в виде строки и вычисляет значение производной при заданном х Логарифм записывается как: (x-2)log(x^2+2) -. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image
8Observer8 10.02.2026
Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .
Установка Qt-версии Lazarus IDE в Debian Trixie Xfce
volvo 10.02.2026
В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru