- Поисковые системы
- Практика оптимизации
- Трафик для сайтов
- Монетизация сайтов
- Сайтостроение
- Социальный Маркетинг
- Общение профессионалов
- Биржа и продажа
- Финансовые объявления
- Работа на постоянной основе
- Сайты - покупка, продажа
- Соцсети: страницы, группы, приложения
- Сайты без доменов
- Трафик, тизерная и баннерная реклама
- Продажа, оценка, регистрация доменов
- Ссылки - обмен, покупка, продажа
- Программы и скрипты
- Размещение статей
- Инфопродукты
- Прочие цифровые товары
- Работа и услуги для вебмастера
- Оптимизация, продвижение и аудит
- Ведение рекламных кампаний
- Услуги в области SMM
- Программирование
- Администрирование серверов и сайтов
- Прокси, ВПН, анонимайзеры, IP
- Платное обучение, вебинары
- Регистрация в каталогах
- Копирайтинг, переводы
- Дизайн
- Usability: консультации и аудит
- Изготовление сайтов
- Наполнение сайтов
- Прочие услуги
- Не про работу
Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий
Вернее, скажем так, не просто обычный h2, а тот что относится к картинкам, т. е. речь идет о schema-разметке. Если что, начало моих терзаний.
Так вот, что получается.
На моем сайте все картинки располагаются в правом углу текста - верхний край картинки наравне с верхним краем текста. При разметке картинок по правилам получается вот так вот
http://fotki.yandex.ru/users/delo-plus/view/714651/?page=1
В общем на сайте это смотрится некрасиво.
Поменяли вот так, h2 после картинки:
<div itemscope="" itemtype="http://schema.org/ImageObject"><img src="images/kartinka.jpg" itemprop="contentUrl" />
<h2 itemprop="name">"Это картинка</h2>
<span itemprop="description">Это самая красивая в мире картинка</span></div>
</div>
http://fotki.yandex.ru/users/delo-plus/view/714652/?page=1
Это тоже не гуд.
Скрыть в display:none хотя бы что-то одно, содержимое дескрипшн или h2 - тоже не вариант.
В общем, придумала я вот что сделать.
http://fotki.yandex.ru/users/delo-plus/view/714653/?page=2
Ну какая Яндексу разница, в самом деле, вертикально или горизонтально там написано? Главное что код не скрыт.
А вот как это сделать?
Что поменять в коде разметки на странице, и что поменять вот тут в css, учитывая что все картинки разного размера?
float: right;
}
.schimage div h2 {
text-align: center;
margin: 0;
padding: 0;
font-size: 12px;
}
.schimage div img {
margin: 0 0 0 10px;
}
.schimage div span {
text-align: center;
display: block;
font-style: italic;
line-height: 14px;
width: 200px;
margin: 0 auto;
}
Попробуйте по этому методу http://www.xiper.net/collect/html-and-css-tricks/typographics/vertical-text.html
омг, это еще и всё разное для всех браузеров...😒
Можно попробовать плавающий, узкий и высокий H2 и
{word-wrap:break-word;}Если в принципе задумка пойдёт - допиливать
http://htmlbook.ru/css/word-wrap
В общем, простого решения и тут нет. 😡
Буду другую мысль придумывать, как-то сложно все с этой вертикалью получается.
{word-wrap:break-word;}
должен подойти же.
Делаете див шириной скажем 10 пикселей (ну или сколько нужно, но чтобы больше 1 символа по ширине не помещалось) и в него пишите нужный текст.
<div style="width:5px;word-wrap:break-word;"><h2>Это картинка</h2></div>
http://guitarizmo.ru/test.html
вот для наглядности
rammlied, спасибо :)
Но мне тут уже один добрый человек другой рецепт дал.
В общем, размещение по вертикали не понадобилось. И по горизонтали тоже "спрятала".