X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Тема закрыта
> Таблицы в ряд.
SpideR-KOSS
SpideR-KOSS
Topic Starter сообщение 22.2.2012, 14:58; Ответить: SpideR-KOSS
Сообщение #1


Здравствуйте.
Нет опыта верстания таблицами, в связи с этим возникла проблема.
Вот код, который выводит таблицу в столбик.
Т.е <div class="nickname"> выводит имя пользователя.
Ниже <div class="avatar"> выводит аватар.
Еще ниже <div class="status"> выводит статус.
В итоге получается, что эти три дива выводятся как единый блок.
<tr>
<td width="" valign="top" align="center">
<div class="nickname">{$usr.nickname}</div>
<div class="avatar">{$usr.avatar}</div>
<div class="status">{$usr.status}</div>
</td>
</tr>

Мне надо, чтобы он выводил эти блоки не в столбик, а например по три в строке.
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Azazaza_hb
Azazaza_hb
сообщение 22.2.2012, 15:39; Ответить: Azazaza_hb
Сообщение #2


[CSS]
td div{float:left}

[/CSS]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
SpideR-KOSS
SpideR-KOSS
Topic Starter сообщение 22.2.2012, 15:52; Ответить: SpideR-KOSS
Сообщение #3


(Azazaza_hb @ 22.2.2012, 18:39) *
[CSS]
td div{float:left}

[/CSS]

Это надо дописать?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Электроник
Электроник
сообщение 22.2.2012, 17:33; Ответить: Электроник
Сообщение #4


(SpideR-KOSS @ 22.2.2012, 18:52) *
Это надо дописать?

да, в css файле
но лучше не задавать всем td и div float:left
а сделать это только там, где нужно
вот тут, почти тоже самое
то есть если в вашем случае, то так
[CSS].nickname {...; float:left;}
.avatar {...; float:left;}
.status {...; float:left;}[/CSS]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
SpideR-KOSS
SpideR-KOSS
Topic Starter сообщение 22.2.2012, 17:57; Ответить: SpideR-KOSS
Сообщение #5


(Электроник @ 22.2.2012, 20:33) *
да, в css файле
но лучше не задавать всем td и div float:left
а сделать это только там, где нужно
вот тут, почти тоже самое
то есть если в вашем случае, то так
[CSS].nickname {...; float:left;}
.avatar {...; float:left;}
.status {...; float:left;}[/CSS]

К сожалению не получилось.
Ниже скрины. Float:left выполняет свою функцию, но не так.
[attachment=38586:Без имени-1.jpg][attachment=38587:Без имени-2.jpg]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Электроник
Электроник
сообщение 22.2.2012, 18:05; Ответить: Электроник
Сообщение #6


(SpideR-KOSS @ 22.2.2012, 17:58) *
Мне надо, чтобы он выводил эти блоки не в столбик, а например по три в строке.

http://www.html.by/attachment.php?attachme...mp;d=1329919010
на скрине то, что вы просили
если float:left; выполнил свою функцию не так как вам надо, значит вам нужен не float:left; )
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Bugnet
Bugnet
сообщение 22.2.2012, 18:16; Ответить: Bugnet
Сообщение #7


div блочный элемент , используйте span
<tr>
<td width="" valign="top" align="center">
<span class="nickname">{$usr.nickname}</span>
<span class="avatar">{$usr.avatar}</span>
<span class="status">{$usr.status}</span>
</td>
</tr>
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
SpideR-KOSS
SpideR-KOSS
Topic Starter сообщение 22.2.2012, 18:26; Ответить: SpideR-KOSS
Сообщение #8


(Bugnet @ 22.2.2012, 21:16) *
div блочный элемент , используйте span
<tr>
<td width="" valign="top" align="center">
<span class="nickname">{$usr.nickname}</span>
<span class="avatar">{$usr.avatar}</span>
<span class="status">{$usr.status}</span>
</td>
</tr>

К сожалению не работает.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Azazaza_hb
Azazaza_hb
сообщение 22.2.2012, 18:34; Ответить: Azazaza_hb
Сообщение #9


уточните вопрос, чем не подходит http://www.html.by/attachment.php?attachme...mp;d=1329919010 ?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
SpideR-KOSS
SpideR-KOSS
Topic Starter сообщение 22.2.2012, 19:07; Ответить: SpideR-KOSS
Сообщение #10


(Azazaza_hb @ 22.2.2012, 21:34) *
уточните вопрос, чем не подходит http://www.html.by/attachment.php?attachme...mp;d=1329919010 ?

Задача такова. На первом скрине видно, что сверху отображается имя пользователя, ниже аватар, еще ниже статус (в сети или не в сети). Еще уточню что это поиск пользователей.
Должно получится вот так (Photoshop).
Т.е должно выводится по три пользователя в строке.
[attachment=38588:Без имени-3.jpg]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Отсортировать данные таблицы
по дням/часам и тп
3 tube 2350 1.7.2017, 0:38
автор: Shandanakar
Открытая тема (нет новых ответов) Нужно настроить мои Таблицы Google
1 rownong27 2463 25.5.2016, 0:13
автор: -rownong-
Открытая тема (нет новых ответов) Экспорт таблицы с сайта
2 wolf7808 3068 17.10.2015, 9:42
автор: -wolf7808-
Открытая тема (нет новых ответов) Как подстроить 3 разные элемента в один ряд
2 Генрих Арутюнян 5540 19.2.2015, 10:43
автор: -Генрих Арутюнян-
Открытая тема (нет новых ответов) размер таблицы
7 modz 6426 24.10.2014, 14:57
автор: -modz-


 



RSS Текстовая версия Сейчас: 17.4.2024, 0:09
Дизайн