Несколько картинок в одной ячейке таблицы

[vlad7777]

Первый раз в жизни пишу на форум. Обычно все уже обсуждалось. Но нигде не нашел что прописать или в CSS или лучше в <td> что бы изображения расположились не в столбик как по умолчанию а в линию в одной ячейке таблицы. Заранее спасибо.

[Great Rash]

Изображения - это строчный элемент (как текст), так что по умолчанию они располагаются в одну строку (как слова в тексте).

[vlad7777]

Код такой:

<td><a href="img/4.jpg" class="Lad" onclick="return hs.expand(this)">

<img src="img/4m.jpg" alt="Lad JS"

title="Нажмите для увеличения" /></a>

<div class="Lad-caption">

<table cellspacing="0" cellpadding="0">

<col width="64" span="3" />

<tr height="17">

<td height="17" width="64">10-2345</td>

<td width="64">Комплект</td>

<td width="64">44-48</td>

</tr>

<tr height="17">

<td height="17"></td>

<td><img src="../../images/Untitled-1 copy.png" /><img src="../../images/Untitled-2copy.png" /></td>

<td></td>

</tr>

</table></td>

Вот эти Untitled-1 и Untitled-2copy и есть катринки(пока примерные конечно).

http://foto.mail.ru/mail/vlad.7777/_myphoto/2.html

Просто этих квадратиков будет не два а от 5 до 10 и столбик это плохо.

Спасибо за быстрый ответ.

Edited April 12, 2011 by vlad7777

[Great Rash]

В чем заключается вопрос? Вы его не задали.

[vlad7777]

В чем заключается вопрос? Вы его не задали.

Как расположить изображения в линию а не в столбик?

[Great Rash]

Изображения по умолчанию располагаются в линию.

[vlad7777]

Изображения по умолчанию располагаются в линию.

Но на скрине видно что два квадратика желтый и красный один над другим.

[Great Rash]

Значит они не помещаются по ширине в ячейку.

[pavelsko]

Может быть между изображениями поставить неразрывный пробел, как вариант? По-моему, как-то alt-ctrl-space... ну а вообще как-то странно, они должны итак в ряд идти, а не в столбик

да, tdwide нужно изменить на большее значение

[vlad7777]

http://foto.mail.ru/mail/vlad.7777/_myphoto/3.html

Вот еще один скрин. Видно что место с боку есть. Размеры ячеек я не задавал. Этот текст "Комплекты..." можно дописывать сколько угодно и место растягивается.

Может быть между изображениями поставить неразрывный пробел, как вариант? По-моему, как-то alt-ctrl-space...

Где можно поставить этот пробел в Дримвивере или блокоте?

[Great Rash]

<table width="30%">
  <tr>
    <td width="10%"><!-- --></td>
    <td width="10%">
      <img src="test.jpg" width="10" height="10" style="background: red;" />
      <img src="test.jpg" width="10" height="10" style="background: red;" />
      <img src="test.jpg" width="10" height="10" style="background: red;" />
      <img src="test.jpg" width="10" height="10" style="background: red;" />
      <img src="test.jpg" width="10" height="10" style="background: red;" />
      <img src="test.jpg" width="10" height="10" style="background: red;" />
    </td>
    <td width="10%"><!-- --></td>
  </tr>
</table>

Вставьте этот код к себе и растягивайте/сужайте окно. И смотрите как располагаются картинки.

[pavelsko]

http://foto.mail.ru/mail/vlad.7777/_myphoto/3.html

Вот еще один скрин. Видно что место с боку есть. Размеры ячеек я не задавал. Этот текст "Комплекты..." можно дописывать сколько угодно и место растягивается.

Где можно поставить этот пробел в Дримвивере или блокоте?

в дриме в режиме текстового редактора  

или в режиме дизайна ctrl+shift+пробел

[vlad7777]

Поменял значения на такое(было еще промежуточное)

<table width="100%">

<tr>

<td width="10%"><!-- --></td>

<td width="80%">

<img src="test.jpg" width="10" height="10" style="background: red;" />

<img src="test.jpg" width="10" height="10" style="background: red;" />

<img src="test.jpg" width="10" height="10" style="background: red;" />

<img src="test.jpg" width="10" height="10" style="background: red;" />

<img src="test.jpg" width="10" height="10" style="background: red;" />

<img src="test.jpg" width="10" height="10" style="background: red;" /> </td>

<td width="10%"><!-- --></td>

</tr>

</table>

В результате все равно столбик http://foto.mail.ru/mail/vlad.7777/_myphoto/4.html

в дриме в режиме текстового редактора  

или в режиме дизайна ctrl+shift+пробел

Попробывал. Они просто разошлись чуть вверх и в низ. Вот((

[Searcher]

Тот код, который вы привели - это все? У вас css используется? Возможно картинки переопределены где-то со строчных на блочные...

[Temiks]

Проверьте доктайп,код ваш работает при доктайпе <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

[vlad7777]

DOCTYPE не помог (

CSS есть конечно, я почему-то был уверен что тут дело строго в таблице и ни что на нее не влияет. Сейчас посмотрю CSS-ы

[Great Rash]

Ок. Тогда для ячейки с картинками white-space: nowrap;.

[Searcher]

Проверьте доктайп,код ваш работает при доктайпе <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Причем тут доктайп? Картинки строчные во всех доктайпах.

vlad7777, дайте ссылку на проблемную траницу.

[vlad7777]

Страница и сайт залиты пока для доработки.

http://bel3.ru/vyaz/vyaz_body/1.html

На ней изображения с 1 по 3-е увеличиваются и появляются в се неудачные эксперименты. Только в 3-м я разбил в разные ячейки и получилось похоже на то как нужно(хотя при большом масштабе вылазят за границу фотографии), но не оставляют мысли пихнуть эти квадратики в одну ячейку.

Edited April 12, 2011 by vlad7777

[Searcher]

Ну конечно. В layout.css есть строка

img{display:block; margin:0; padding:0; border:none;}

Уберите display:block; Если где-то потребуется сделать картинку блочной пропишите ей класс и устанавливайте свойства этому классу, а вот так все картинки без разбору делать блочными - в корне не верно.

И избавьтесь от inline-стилей! Переведите все в css. Потом исправлять что-то или редактировать нереально будет.

[psywalker]

да, и это тоже я думаю лишнее margin:0; padding:0;

[vlad7777]

Ну конечно. В layout.css есть строка

img{display:block; margin:0; padding:0; border:none;}

Все как по написаному))) Спасибо большое,получилось.

Дело в том что это мой первый сайт. И я не знаю в каком месте на сайте inline-стили((. Подскажите пожалуйста. Если это правда усложнит дальнейшую работу я бы от них избавился.

Edited April 12, 2011 by vlad7777

[Searcher]

Для первого сайта вы весьма сложную задачу поставили... inline-стили - это то, что в тэгах в параметре style. У вас скрипты показа фото что-то много inline-стилей забабахивают...