css меню

[bacteriophage]

Вобщем, ситуация такая: требуется сделать горизонтальное меню, желательно через список [list], таким образом чтобы текст в каждом пункте распологался под картинкой. Фрагмент кода:

//в стилях:

#menu li {
****display: inline;
****margin-left: 15px;
****font-size: 12px;
}

//в документе:

<div id="menu">
[img]img/menubox.gif[/img]пункт меню
[img]img/menubox.gif[/img]пункт меню
[img]img/menubox.gif[/img]пункт меню
</div>

никак не могу сделать перенос текста под картинку, чтобы пункты ([*]) при этом остались в одну строчку. Кто может, решите задачу плиз! Использование таблиц не предлагать ))

[Aykroyd]

Originally posted by bacteriophage@Mar 11 2007, 02:39
Использование таблиц не предлагать ))
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]
Семантику предпочитаете? Это радует.
Только если уж предпочитаете, предпочитайте ее до конца: Ваши изображения должны идти фоном, а не тэгом <img>. Это, кстати, попутно и решит Вашу проблему...

[bacteriophage]

не совсем катит... дело в том, что текст процентов на тридцать длинее картнки, и тут не без проблемы: либо картинка не будет ссылкой (если делать ее фоном), либо ссылкой будет также и пустое пространство над текстом, если делать что-то типа <a><div></div></a>.
Может у меня требования завышенные конечно, но так хочется картинку ссылкой сделать... ))

[Zigzag]

<div id="menu">
[Только зарегистрированные пользователи могут видеть ссылки. ]
[Только зарегистрированные пользователи могут видеть ссылки. ]
[Только зарегистрированные пользователи могут видеть ссылки. ]
</div>

li { float: left; }
li a { display: block; background: url(image.jpg) 0 0; }

a dlya[*] zadaite razmery libo otstupy i budet vam prekrasnoe menyu, kak tu, naprimer [Только зарегистрированные пользователи могут видеть ссылки. ]

[Aykroyd]

Что-то как-то смутно Вы все объясняете, честно говоря...

Originally posted by bacteriophage@Mar 11 2007, 03:45
дело в том, что текст процентов на тридцать длинее картнки, и тут не без проблемы:
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]
Да нет тут никакой проблемы...

Originally posted by bacteriophage@Mar 11 2007, 03:45
либо картинка не будет ссылкой (если делать ее фоном)
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]
Еще как будет.
Назначьте для текстовой ссылки display: block;
И тогда хоть ролловер фоном, хоть вообще что угодно...

Originally posted by bacteriophage@Mar 11 2007, 03:45
если делать что-то типа <a><div>

</a>.
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]</div>[/quote]
Боже упаси! Зачем? Ссылка не может содержать блочных элементов. Валидатор Вас точно не порадует...

Originally posted by bacteriophage@Mar 11 2007, 03:45
Может у меня требования завышенные конечно, но так хочется картинку ссылкой сделать... ))
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]
Нормальные требования. Задача пустяковая. Никаких проблем не вижу в любом варианте...

[bacteriophage]

спасибо, буду пробовать...

[bacteriophage]

Zigzag
Мега спасибо, этот вариант подошел!!!

[Zigzag]

Originally posted by bacteriophage@Mar 11 2007, 03:42
Zigzag
Мега спасибо, этот вариант подошел!!!*
<div align='right'>[Только зарегистрированные пользователи могут видеть ссылки. ]

[/quote]

ne za chto, priem elementarnyj. glavnoe ne sdavaites&#39; i so vremenem vse men&#39;she voprosov budet. vse poluchitsya.