Проблема - точки между буквами

[AlexBes]

Добрый день, столкнулась с проблемой верстки части макета (найден в сети).

В меню точки поставила через list-style-image, а вот как поставить точки в заголовке между буквами - без понятия.

1 вариант - вставить весь заголовок картинкой.
2 вариант - сделать так же, как и в меню - каждую букву обернуть в li + list-style-image.

 

может есть еще какой-то вариант, о котором я не знаю?

 

[Zverushka]

Можно оберунть каждую букву в span и вставить псевдоэлемент с абсолютным позиционированием и картинкой точки. Но по-моему это логотип и лучше вставить просто картинкой эту надпись.

Edited May 16, 2014 by Zverushka

[Sensei]

Можно сделать так http://jsfiddle.net/ApYyL/

[xzarxzes]

http://jsfiddle.net/xzarxzes/SFJAp/.

 

upd: Но мне тоже кажется, что здесь не стоит заморачиваться, а сделать либо картинкой, либо h1 в него поместить a с картинкой бекганудом написать "simple creative" и задать text-indent -9999px

Edited May 16, 2014 by xzarxzes

[AlexBes]

спасибо большое, я тоже склоняюсь к картинке, но теперь хоть буду знать, что сделать это в принципе реально

[SelenIT]

задать text-indent -9999px

Самый неудачный способ image-replacement'а, имхо. В сценарии «стили сработали, картинка не загрузилась» бедный юзер вынужден созерцать пустоту и постигать дзен. Логотип — это просто картинка, часть контента, которая <img> с alt.