LINUX.ORG.RU

Текст поверх картинки


0

0

Кроме как с двумя дивами(один с бэкграунд картинкой, второй просто сдвигается относительно первого с помощью CSS) есть какие-нить идеи, как поместить текст поверх картинки ?

★☆

намалевать текст на картинке гимпом?

mirage
()

А чем этот вариант не устраивает, можно поинтересоваться? По мне, так нормальное решение. И работать везде будет

it-partizan
()

Вариант с одним дивом (или таблицей/параграфом/etc), Картинка в бэкграунде, css или обычном (если quirks пофиг или неXHTML) (при желании двигается до нужной позиции).

x3al ★★★★★
()
Ответ на: комментарий от it-partizan

> А чем этот вариант не устраивает, можно поинтересоваться? По мне, так нормальное решение. И работать везде будет

в разных браузерах разъезжается, текст часто получается шире картинки )

> Вариант с одним дивом (или таблицей/параграфом/etc), Картинка в бэкграунде, css или обычном (если quirks пофиг или неXHTML) (при желании двигается до нужной позиции).

один див с бэкграундом не подходит, картинке ширину нужно указать в процентах ...

phasma ★☆
() автор топика
Ответ на: комментарий от phasma

блин, ну ты бы шот показал и набросок кода, что ты на пальцах-то…

mirage
()
Ответ на: комментарий от phasma

Тогда отдельно картинка (img), можно и без дива, и отдельно текст. Тексту релятивная позиция, смещение на высоту картинки (если высота тоже не в процентах). Желательно текст поближе к картинке (сразу после картинки со смещением -высота_картинки подойдет). При релятивной позиции не будет ехать.

x3al ★★★★★
()
Ответ на: комментарий от x3al

> Тогда отдельно картинка (img), можно и без дива, и отдельно текст. Тексту релятивная позиция, смещение на высоту картинки (если высота тоже не в процентах). Желательно текст поближе к картинке (сразу после картинки со смещением -высота_картинки подойдет). При релятивной позиции не будет ехать.

так и делаю, можно попробовать растянуть бэкграунд на весь див, но эт не Ъ, картинка 10px и может стать квадратной какашкой ...

phasma ★☆
() автор топика
Ответ на: комментарий от x3al

> max-width+костыли для IE никто не отменял.

про IE особо не замарачиваюсь, вылезет ССЗБ - переходи на нормальный браузер )

phasma ★☆
() автор топика
Ответ на: комментарий от phasma

s/вылезет ССЗБ/вылезет что-то, ССЗБ

phasma ★☆
() автор топика
Ответ на: комментарий от phasma

А у тебя сказано, что надо именно на CSS? И чем тебе не нравится серверсайдное решение? Надежно и кроссплатформенно.

anonymous
()
Ответ на: комментарий от anonymous

> А у тебя сказано, что надо именно на CSS?

ну просто не вижу других способов

> И чем тебе не нравится серверсайдное решение? Надежно и кроссплатформенно.

80 тысяч человек зайдут на страницу и скрипту придется генерировать ~800 тысяч картинок в день ... все должно отображаться в реальном времени, а не через 10 - 30 минут обновляться ...

phasma ★☆
() автор топика
Ответ на: комментарий от phasma

доктор, а может, консерваторию как-то перестроить?

mirage
()

<div style="width: (WIDTH)%; height: 10px; background-image: url(/i/voting/(COLOR).gif);"></div><div style="position: relative; bottom: +12px; margin-bottom: -10px; text-align: center;">(WIDTH)%</div>

сделал по странике, Opera 9.5/FF 2/IE6 парсят нормально

phasma ★☆
() автор топика
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.