Comments 17
Вообще этот код некорректен, свойство vertical-align предназначено только для ячеек таблиц. В данном случае следует использовать background-image и padding-left у надписи.
Как-то непорядки у вас с мат. частью…
www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align
Applies to: inline-level and 'table-cell' elements
HTML-свойство align=«absmiddle» отрисовывалось абсолютно так же, как и это CSS-правило, вторую картинку делать лень.
Погуглите на досуге «css replace align=absmiddle»
Читаем задачу вдумчиво еще раз: выровнять картинку относительно строки текста по горизонтали
О каком background может идти речь?
www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align
Applies to: inline-level and 'table-cell' elements
HTML-свойство align=«absmiddle» отрисовывалось абсолютно так же, как и это CSS-правило, вторую картинку делать лень.
Погуглите на досуге «css replace align=absmiddle»
Читаем задачу вдумчиво еще раз: выровнять картинку относительно строки текста по горизонтали
О каком background может идти речь?
Простой способ сделать выравненную маленькую картинку перед какой-либо надписью:
[div style=«background: url(xxx) no-repeat; padding-left: 20px; background-position: left center»]надпись[/div]
[div style=«background: url(xxx) no-repeat; padding-left: 20px; background-position: left center»]надпись[/div]
Предполагается, что картинка лежит в потоке текста…
А если я на эту картинку хочу кликнуть?
А если я на эту картинку хочу кликнуть?
Можно заюзать не div а a. В большинстве случаев это даже красивее, чем картинка в потоке, т. к. можно, например, создать класс .icqnumber и все номера icq делать с цветочком слева. Но если все же хочется иметь отдельную картинку, то видимо наиболее очевидным способом будет использование таблицы, некрасиво конечно, зато везде работать будет.
А поводу vertical-align я даже удивился. Когда-то где-то читал, что он только для ячеек…
UFO just landed and posted this here
Да, натыкаюсь на эту проблему постоянно, приходится подставлять костыли типа мнимых отступов, маргинов-паддингов и прочего по ситуации
Имхо, тут дело в антиальясинге шрифтов — нет? Не попробуете ли проверить?
Лень уже запускать NP++, даже чтобы написать несколько строк: хочется расслабиться и потупить :) Извините
Лень уже запускать NP++, даже чтобы написать несколько строк: хочется расслабиться и потупить :) Извините
Ну как бы вы картинку относительно чего центрируете? Относительно строки текста? А она по вертикали остается top. Плюс, картинка 15px а высота строки вероятно четная 16px. отсюда мелкие нестыковки…
Попробуйте так:
бэкграунд здесь только для того, чтобы видно было где реальные граница строки, а не текста. У меня в IE7/FF3/Opera/safari одинаково.
Попробуйте так:
<body> <img alt='' src='test.gif' style='vertical-align:middle'/> <span style='line-height:15px;background:#ccc;vertical-align:middle'><img src='test.gif' /></span> </body>
бэкграунд здесь только для того, чтобы видно было где реальные граница строки, а не текста. У меня в IE7/FF3/Opera/safari одинаково.
UFO just landed and posted this here
Sign up to leave a comment.
Различное поведение браузерных движков в отношении стандартов