ReSQL.ru
     
powered by simpleCommunicator - 2.0.36     © 2025 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Правильное создание списка
12 сообщений из 12, страница 1 из 1
Правильное создание списка
    #34025754
Фотография Damnedest
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Damnedest
Участник
Надо сделать список дерево документов при помощи вложеннных списков.


Основные требование:
Текст относительно иконки должен выравниваться по центру иконки
Должно корректно все работать, если текст не умещается в одну строчку (текст должен писать после иконки)


Вот что мне удалось сделать. Проблема в том. что в IE мужду списками появляется разделитель.
Код: plaintext
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.
<style>
ul, li
{

}

ul, li
{
    font-size: 8pt;
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}

li ul
{
    padding: 0px 0px 0px 17px;
    margin: 0px;
}

li div
{
    height: 17px;
    margin: 0px;
    padding: 0px;
}
</style>

<ul>
  <li><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><div> 1 </div></li>
  <li><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><div> 2 </div>
    <ul>
      <li><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><div> 1 . 1 </div></li>
      <li><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><div> 1 . 2 </div></li>
      <li><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><div> 1 . 3 </div></li>
      <li><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><div> 1 . 4 </div></li>
    </ul>
  </li>
  <li><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><div> 3 </div></li>
  <li><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><img src="doc_file.gif" hspace="0" vspace="0" border="0" align="left" /><div> 4 </div></li>
</ul>


Помогите пожалуйста.
посмотреть пример можно тут: http://ereih.dev.belti.ru/index2.php
...
Рейтинг: 0 / 0
02.10.2006, 12:51
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34025815
Фотография Black
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Black
Участник
Модератор: Перенесено из форума PHP&PERL
...
Рейтинг: 0 / 0
02.10.2006, 13:08
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34025970
maXmo
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
maXmo
Участник
а если заменить див на спан?
...
Рейтинг: 0 / 0
02.10.2006, 13:50
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34025984
Фотография Damnedest
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Damnedest
Участник
Если заменять на span, то в мозиле все отображается криво.
div сделан для того, чтобы текст отображался после иконки корректно при двухстрочном названии
...
Рейтинг: 0 / 0
02.10.2006, 13:53
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34026023
maXmo
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
maXmo
Участник
вообще говоря, странно как-то оно отображается. Всегда думал, что див имеет модель отображения block. Я так понимаю, хочется, чтобы многострочный текст был весь строго правее картинки? Если так, делай таблицей.
...
Рейтинг: 0 / 0
02.10.2006, 14:03
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34026053
Фотография Damnedest
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Damnedest
Участник
Можно конечно забить на списки и сверстать это все таблицей... но нафига тогда списки собственно...

С помощью таблицы переверстал. В ИЕ стало лучше, в мозиле все как было отлично так и осталось.

Проблема в том, что между двумя пунктами появляется пустое место...
...
Рейтинг: 0 / 0
02.10.2006, 14:13
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34026076
maXmo
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
maXmo
Участник
DamnedestМожно конечно забить на списки и сверстать это все таблицей... но нафига тогда списки собственно...для списочного представления. Ты ведь затруднился выровнять текст относительно картинки - вот для этого таблица и нужна.

DamnedestПроблема в том, что между двумя пунктами появляется пустое место...ну это маржины и падинги нули.
...
Рейтинг: 0 / 0
02.10.2006, 14:19
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34026081
Фотография Damnedest
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Damnedest
Участник
В том то и дело что все обнулено. Все что только есть
http://ereih.dev.belti.ru/index2.php. Вот тут оба варианта.

Если смотреть под мозилой, то это идеальный вариант... Если под ие, то это неправильный вариант.
...
Рейтинг: 0 / 0
02.10.2006, 14:20
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34026175
maXmo
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
maXmo
Участник
да уж. Осёл непокорен. :)
...
Рейтинг: 0 / 0
02.10.2006, 14:55
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34026239
Фотография Damnedest
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Damnedest
Участник
Вот в том то и дело... и вот как от этой штуки избавиться я не знаю... не верстать же все на таблицах
...
Рейтинг: 0 / 0
02.10.2006, 15:10
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34026299
maXmo
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
maXmo
Участник
добавь снизу
Код: plaintext
1.
ul { height: 0px; }
li { border: 1px solid black; }
и смотри, что с дивами происходит. Но это полный маразм.
...
Рейтинг: 0 / 0
02.10.2006, 15:25
| Ответить | Цитировать | Написать  
Правильное создание списка
    #34026357
Фотография Damnedest
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Damnedest
Участник
Да уж... Значит вердикт один...
Такую верстку можно сделать только используя большую вложенность таблиц, других вариантов нет :(
А жаль... хотел сделать все нормально, а не через одно место
...
Рейтинг: 0 / 0
02.10.2006, 15:38
| Ответить | Цитировать | Написать  
12 сообщений из 12, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Правильное создание списка
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение
NoSQL.ru             Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&tid=1459300]:
 0ms
get settings:
 11ms
get forum list:
 13ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 56ms
get topic data:
 13ms
get forum data:
 3ms
get page messages:
 43ms
get tp. blocked users:
 1ms
others: 13ms
total:  161ms
созд. / загр.: 161ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]