VPF::Расположение картинок внутри таблицы

Aliance

Дата 8.1.2007, 22:45 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 2
Всего: 137

Есть табличка, как бы в ней сделать так, чтобы элементы не зависимо от количества картинок в последнем столбце (их может быть от 1 до 5, т.е. не больше чем в остальных) отображались ровно,а расстояние между строчками таблицы было минимальным.

Код


                                    <table>
                                        <tr>
                                            <td>
                                                <br /><img src="http://img.combats.ru/i/items/mater16.gif" alt="Morgenshtern" title="Глубинный Камень" width="25" height="25" /> ( 6 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater2.gif" alt="Morgenshtern" title="Золото" width="25" height="25" /> ( 9 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater23.gif" alt="Morgenshtern" title="Ралиэль" width="25" height="25" /> ( 2 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater27.gif" alt="Morgenshtern" title="Камень Затаённого Солнца" width="25" height="25" /> ( 4 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater19.gif" alt="Morgenshtern" title="Кристалл Времён" width="25" height="25" /> ( 7 шт. )
                                            </td>
                                            <td>
                                                <br /><img src="http://img.combats.ru/i/items/mater13.gif" alt="Morgenshtern" title="Кристалл Тысячи Ответов" width="25" height="25" /> ( 10 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater10.gif" alt="Morgenshtern" title="Кора Змеиного Дерева" width="25" height="25" /> ( 5 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater11.gif" alt="Morgenshtern" title="Кожа Общего Врага" width="25" height="25" /> ( 6 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater4.gif" alt="Morgenshtern" title="Лучистое Серебро" width="25" height="25" /> ( 6 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater28.gif" alt="Morgenshtern" title="Лучистый Рубин" width="25" height="25" /> ( 2 шт. )
                                            </td>
                                            <td>
                                                <br /><img src="http://img.combats.ru/i/items/mater29.gif" alt="Morgenshtern" title="Лучистый Топаз" width="25" height="25" /> ( 2 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater17.gif" alt="Morgenshtern" title="Плод Змеиного Дерева" width="25" height="25" /> ( 8 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater15.gif" alt="Morgenshtern" title="Сгусток Астрала" width="25" height="25" /> ( 4 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater14.gif" alt="Morgenshtern" title="Сгусток Эфира" width="25" height="25" /> ( 8 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater7.gif" alt="Morgenshtern" title="Слиток Пустынной Руды" width="25" height="25" /> ( 6 шт. )
                                            </td>
                                            <td>
                                                <br /><img src="http://img.combats.ru/i/items/mater12.gif" alt="Morgenshtern" title="Сталь" width="25" height="25" /> ( 12 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater24.gif" alt="Morgenshtern" title="Стихиалия" width="25" height="25" /> ( 1 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater3.gif" alt="Morgenshtern" title="Серебро" width="25" height="25" /> ( 6 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater8.gif" alt="Morgenshtern" title="Троекорень" width="25" height="25" /> ( 8 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater18.gif" alt="Morgenshtern" title="Тысячелетний Камень" width="25" height="25" /> ( 4 шт. )
                                            </td>
                                            <td>
                                                <br /><img src="http://img.combats.ru/i/items/mater21.gif" alt="Morgenshtern" title="Эссенция Глубины" width="25" height="25" /> ( 2 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater20.gif" alt="Morgenshtern" title="Эссенция Лунного Света" width="25" height="25" /> ( 3 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater22.gif" alt="Morgenshtern" title="Эссенция Чистоты" width="25" height="25" /> ( 1 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater6.gif" alt="Morgenshtern" title="Железное Дерево" width="25" height="25" /> ( 5 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater1.gif" alt="Morgenshtern" title="Шкура Пещерного Оленя" width="25" height="25" /> ( 9 шт. )
                                            </td>
                                            <td>
                                                <br /><img src="http://img.combats.ru/i/items/mater30.gif" alt="Morgenshtern" title="Шёпот Гор" width="25" height="25" /> ( 3 шт. )
                                            </td>
                                        </tr>
                                    </table>

Это сообщение отредактировал(а) Aliance - 8.1.2007, 23:01

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

EDuard

Дата 9.1.2007, 01:18 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 331
Регистрация: 1.8.2005
Где: Синее нигде

Репутация: 5
Всего: 7

Aliance, коментарий обязательно справа от картинки?

Это сообщение отредактировал(а) EDuard - 9.1.2007, 01:20

--------------------

Aliance

Дата 9.1.2007, 01:27 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 2
Всего: 137

Да, обязателен.
Саму верстку можно изменить, мне главное чтоб были картинки, по 5 штук в каждой колонке (в последней можно меньше), и справа от них комментарии. Я вот думаю, может без таблиц сделать?

Добавлено @ 01:36
Все, сделал:

Код


                                    <table style="height: 200px; white-space: nowrap;">
                                        <tr>
                                            <td style="width: 95px; vertical-align: top">
                                                <br /><img src="http://img.combats.ru/i/items/mater16.gif" alt="Morgenshtern" title="Глубинный Камень" width="25" height="25" /> ( 6 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater2.gif" alt="Morgenshtern" title="Золото" width="25" height="25" /> ( 9 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater23.gif" alt="Morgenshtern" title="Ралиэль" width="25" height="25" /> ( 2 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater27.gif" alt="Morgenshtern" title="Камень Затаённого Солнца" width="25" height="25" /> ( 4 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater19.gif" alt="Morgenshtern" title="Кристалл Времён" width="25" height="25" /> ( 7 шт. )
                                            </td>
                                            <td style="width: 95px; vertical-align: top">
                                                <br /><img src="http://img.combats.ru/i/items/mater13.gif" alt="Morgenshtern" title="Кристалл Тысячи Ответов" width="25" height="25" /> ( 10 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater10.gif" alt="Morgenshtern" title="Кора Змеиного Дерева" width="25" height="25" /> ( 5 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater11.gif" alt="Morgenshtern" title="Кожа Общего Врага" width="25" height="25" /> ( 6 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater4.gif" alt="Morgenshtern" title="Лучистое Серебро" width="25" height="25" /> ( 6 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater28.gif" alt="Morgenshtern" title="Лучистый Рубин" width="25" height="25" /> ( 2 шт. )
                                            </td>
                                            <td style="width: 95px; vertical-align: top">
                                                <br /><img src="http://img.combats.ru/i/items/mater29.gif" alt="Morgenshtern" title="Лучистый Топаз" width="25" height="25" /> ( 2 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater17.gif" alt="Morgenshtern" title="Плод Змеиного Дерева" width="25" height="25" /> ( 8 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater15.gif" alt="Morgenshtern" title="Сгусток Астрала" width="25" height="25" /> ( 4 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater14.gif" alt="Morgenshtern" title="Сгусток Эфира" width="25" height="25" /> ( 8 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater7.gif" alt="Morgenshtern" title="Слиток Пустынной Руды" width="25" height="25" /> ( 6 шт. )
                                            </td>
                                            <td style="width: 95px; vertical-align: top">
                                                <br /><img src="http://img.combats.ru/i/items/mater12.gif" alt="Morgenshtern" title="Сталь" width="25" height="25" /> ( 12 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater24.gif" alt="Morgenshtern" title="Стихиалия" width="25" height="25" /> ( 1 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater3.gif" alt="Morgenshtern" title="Серебро" width="25" height="25" /> ( 6 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater8.gif" alt="Morgenshtern" title="Троекорень" width="25" height="25" /> ( 8 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater18.gif" alt="Morgenshtern" title="Тысячелетний Камень" width="25" height="25" /> ( 4 шт. )
                                            </td>
                                            <td style="width: 95px; vertical-align: top">
                                                <br /><img src="http://img.combats.ru/i/items/mater21.gif" alt="Morgenshtern" title="Эссенция Глубины" width="25" height="25" /> ( 2 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater20.gif" alt="Morgenshtern" title="Эссенция Лунного Света" width="25" height="25" /> ( 3 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater22.gif" alt="Morgenshtern" title="Эссенция Чистоты" width="25" height="25" /> ( 1 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater6.gif" alt="Morgenshtern" title="Железное Дерево" width="25" height="25" /> ( 5 шт. )
                                                <br /><img src="http://img.combats.ru/i/items/mater1.gif" alt="Morgenshtern" title="Шкура Пещерного Оленя" width="25" height="25" /> ( 9 шт. )
                                            </td>
                                            <td style="width: 95px; vertical-align: top">
                                                <br /><img src="http://img.combats.ru/i/items/mater30.gif" alt="Morgenshtern" title="Шёпот Гор" width="25" height="25" /> ( 3 шт. )
                                            </td>
                                        </tr>
                                    </table>

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

EDuard

Дата 9.1.2007, 01:38 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 331
Регистрация: 1.8.2005
Где: Синее нигде

Репутация: 5
Всего: 7

Возможно подойдет.

Код


<html>
 <head>
 </head>
 <style>
 table, td{
 vertical-align: top;
 }
 </style>
 <body>
 <table>
                                        <tr>
                                            <td>
                                                <div><img src="http://img.combats.ru/i/items/mater16.gif" alt="Morgenshtern" title="Глубинный Камень" width="25" height="25" /> ( 6 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater2.gif" alt="Morgenshtern" title="Золото" width="25" height="25" /> ( 9 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater23.gif" alt="Morgenshtern" title="Ралиэль" width="25" height="25" /> ( 2 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater27.gif" alt="Morgenshtern" title="Камень Затаённого Солнца" width="25" height="25" /> ( 4 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater19.gif" alt="Morgenshtern" title="Кристалл Времён" width="25" height="25" /> ( 7 шт. )</div>
                                            </td>
                                            <td>
                                                <div><img src="http://img.combats.ru/i/items/mater13.gif" alt="Morgenshtern" title="Кристалл Тысячи Ответов" width="25" height="25" /> ( 10 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater10.gif" alt="Morgenshtern" title="Кора Змеиного Дерева" width="25" height="25" /> ( 5 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater11.gif" alt="Morgenshtern" title="Кожа Общего Врага" width="25" height="25" /> ( 6 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater4.gif" alt="Morgenshtern" title="Лучистое Серебро" width="25" height="25" /> ( 6 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater28.gif" alt="Morgenshtern" title="Лучистый Рубин" width="25" height="25" /> ( 2 шт. )</div>
                                            </td>
                                            <td>
                                                <div><img src="http://img.combats.ru/i/items/mater29.gif" alt="Morgenshtern" title="Лучистый Топаз" width="25" height="25" /> ( 2 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater17.gif" alt="Morgenshtern" title="Плод Змеиного Дерева" width="25" height="25" /> ( 8 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater15.gif" alt="Morgenshtern" title="Сгусток Астрала" width="25" height="25" /> ( 4 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater14.gif" alt="Morgenshtern" title="Сгусток Эфира" width="25" height="25" /> ( 8 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater7.gif" alt="Morgenshtern" title="Слиток Пустынной Руды" width="25" height="25" /> ( 6 шт. )</div>
                                            </td>
                                            <td>
                                                <div><img src="http://img.combats.ru/i/items/mater12.gif" alt="Morgenshtern" title="Сталь" width="25" height="25" /> ( 12 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater24.gif" alt="Morgenshtern" title="Стихиалия" width="25" height="25" /> ( 1 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater3.gif" alt="Morgenshtern" title="Серебро" width="25" height="25" /> ( 6 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater8.gif" alt="Morgenshtern" title="Троекорень" width="25" height="25" /> ( 8 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater18.gif" alt="Morgenshtern" title="Тысячелетний Камень" width="25" height="25" /> ( 4 шт. )</div>
                                            </td>
                                            <td>
                                                <div><img src="http://img.combats.ru/i/items/mater21.gif" alt="Morgenshtern" title="Эссенция Глубины" width="25" height="25" /> ( 2 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater20.gif" alt="Morgenshtern" title="Эссенция Лунного Света" width="25" height="25" /> ( 3 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater22.gif" alt="Morgenshtern" title="Эссенция Чистоты" width="25" height="25" /> ( 1 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater6.gif" alt="Morgenshtern" title="Железное Дерево" width="25" height="25" /> ( 5 шт. )</div>
                                                <div><img src="http://img.combats.ru/i/items/mater1.gif" alt="Morgenshtern" title="Шкура Пещерного Оленя" width="25" height="25" /> ( 9 шт. )</div>
                                            </td>
                                            <td>
                                                <div><img src="http://img.combats.ru/i/items/mater30.gif" alt="Morgenshtern" title="Шёпот Гор" width="25" height="25" /> ( 3 шт. )</div>
                                            </td>
                                        </tr>
                                    </table>
                    </body>
                    </html>

--------------------

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »