HTML Coding
Subforums
-
- 30.1k
- posts
-
- 1k
- posts
-
- Про макеты
- By klierik,
Explore Questions
There are no popular questions to show right now
-
0 votes0 answers
-
0 votes0 answers
-
0 votes0 answers
-
0 votes1 answer
-
0 votes3 answers
29542 questions in this forum
-
Masonry: странное поведение
Здравствуйте! Впервые решила использовать на сайте библиотеку Masonry. Вот так подключаю: <ul id="masonry" class="js-masonry clearfix" data-masonry-options='{ "columnWidth": 210, "itemSelector": ".item", "gutter": 10 }'> Но при тестировании обнаружилась странная проблема. если страницу просматривать в Safari под Windows 8, то сначала страница выглядит так: Затем, если изменять ширину экрана вручную, то все встает на свои места. И еще в других браузерах сначала картинки выстраивались в один вертикальный ряд, а после изменения ширины экрана - также все восстанавливалось. В чем может быть проблема?
0 votes4 answers -
еще одна проблемка с ссылками
Походу верстки своего первого сайта вылезла еще одна проблема. Что мне нужно получить: Как видите при наведении меняется цвет и цифры и текста. Поэтому я решила поместить цифры в спан и задать им отдельные стили: <ul><li><a href="#"><span class="number">1</span>Lorem ipsum</a></li><li><a href="#"><span class="number">2</span>ea mollitia</a></li><li><a href="#"><span class="number">3</span>assumenda minima</a></li><li><a href="#"><span class="number">4</span>sit amet</a></li></ul>С текстом я разобралась, там то не…
0 votes2 answers -
Резиновый двухколоночный макет с фиксированной шириной правого блока
Пытаюсь сверстать адаптивную вёрстку сайта с двумя колонками. Я сделал два блока с атрибутами inline-block внутри общего контейнера. Задал левому ширину 80%, а правому 20%. И задал min-weight и max-weight. Но теперь моя задача усложнилась. Мне надо, чтобы правая колонка всегда была 200px, а левая заполняла всё оставшееся место. Можно так сверстать с помощью float и margin-right. Но мне нужно, чтобы правая колонка проваливалась вниз при достижении min-width для левой колонки. Как это можно сделать?
0 votes4 answers -
Заголовок поста
У меня есть сверстанный блок Но при его увеличении и когда я открываю в мозилле, вот что происходит: Как быть? На всякий случай, код с css /*Content*/#content .post { width: 460px; padding: 0 15px 0 5px; float: left;}.square { margin: 4px 4px 0 0;}.phead { margin-bottom: 15px;}.phead h3 { display: inline-block; margin:0; }.phead h3 a { text-decoration: none; text-transform: uppercase; color: #7E7E7E; font-family: Oswald, Tahoma, sans-serif; }.lines {display: inline-block;}.post img { float: left;} .entry { text-align: justify;}.entry img { margin-right: 8px;}
0 votes1 answer -
Частичная прозрачность img
Доброго дня уважаемое сообщество. Подскажите пожалуйста, как можно сделать так, чтобы у картинки в теге img (именно в img) была боковая прозрачность с обеих сторон? (вариант с блоком поверху и его прозрачностью не подходит ибо нужно, чтобы фон просвечивался). Можно ли вообще такое сделать? Заранее спасибо за любую помощь. ссылка на изображение, размер: 466 кбайт, 1011 x 360 точек
0 votes7 answers -
Как прописать ссылку к классу more-link
Класс у кнопки "more" присвоен "more-link"...как я понял... Как прописать в файле html в данном коде ссылку, чтобы "Далее" было кликабельным (переход на другую страницу)? Или это возможно только при помощи style.css? Код: <li class="grid_3"> <a href="javascript:void(0);" class="hover_img"> <span class="img_bord"><img src="images/img_bord.png" /></span> <img src="images/portfolio/6.jpg" alt="" /> <span class="portfolio_descr"> <p>Текст1</p> <span>Текст2</span> <span class="more_link" >Далее</span> </span> </a> </li>
0 votes18 answers -
Помощь в верстке сайта для ведущих
Добрый день! Прошу помочь в верстке сайта http://podarok.roool.ru/. Съехал весть текст в бок и я не могу его поправить. Может подскажите что еще можно исправить на сайте и в коде в плане SEO-оптимизации
0 votes10 answers -
Open Graph и абракадабра
Ребят, возникла проблема. Разметил страницу опен графом, кодировка utf8, в .htaccess также отметил utf8. В браузерах всё отображается нормально. Но стоит вставить ссылку в какую-нибудь соц сеть, как та выводит вместо кириллицы абракадабру... Что это может быть? В интернете о такой проблеме вообще нет инфы
0 votes1 answer -
востребованность REST
у меня вопрос про сферического коня в вакууме. может кто и ответит заинтересовался restful-приложениями. скажите кто-нибудь ими занимался? они востребованы настолько чтобы приносить доход? мне идея нравится. есть возможность с любого клиента/устройства подключиться например через http и получить данные в нужном формате с одной стороны хотелось бы изучить технологию, но с другой стороны не совсем понятно как потом применять знания. в случае с сайтами идёшь на фриланс и видишь заказы, а тут перспективы неясные. но для меня привлекатльность в том, что не придётся конкурировать с армией полуграмотных цмсников, готовых за копейки продавать свой труд. к тому же, думаю, зак…
0 votes7 answers -
проблема со шрифтом и тенью
Здравствуйте! При верстке учебного макета Влада http://htmlbook.ru/samlayout/verstka-na-html5/maket-saita столкнулся с двумя проблемами: 1. шрифт jacob_ctt.ttf ну ни как не хочет отображаться на страничке. Хотя в систему (виндовс) ставится нормально. Если вместо него подсунуть в css дпугой шрифт - все работает. Подключаю фонт так: @font-face { font-family: JacobCTT; src: url(../mock_up/jakob_ctt.ttf);} 2. как не пытался не смог "подсунуть" .informer:after под .informer или "перекрыть" .informer:after .informer`ом. для создания тени. Подскажите, как решить эти 2 проблемы? Сама верстка находится тут: http://snake3.16mb.com/Lion/page.html
0 votes5 answers -
Как убрать краткое описание товара на страницы товара
Подскажите пожалуйста как реализовать такую фишку как на сайте Розетка чтобы скрывать краткое описание а при наведении оно появлялось ! Вот на таком сайте
0 votes2 answers -
Как лучше проверить является ли бутстрап-верстка responsive на персоналке
Всем привет, Есть сайт разрабатываемый на основе бутстрап-темплейта. Надо проверить является ли бутстрап-верстка responsive на маленьких и очень маленьких устройствах. А как-то лучше проверить на персоналке с 22дюймовым монитором ?
0 votes5 answers -
Нужно реализовать такую фишку скрывать краткое описание
реализовать такую фишку как на сайте Розетка чтобы скрывать краткое описание а при наведении оно появлялось ! Вот на таком сайте ocStore Версия 1.5.5.1.2
0 votes5 answers -
Вопрос от чайника по размеру изображений
Доброго времени суток! Я самая что ни на есть начинающая. Купила книгу по html, вот сижу ее штудирую. Поэтому заранее прошу пощения за совершенно идиотский вопрос. Автор сначала нарезает макет будущего сайта, сохраняет изображения и пр. и пр. Потом начинает верстать сайт с самого начала. И на моменте, когда он добавляет в код изображения, я немного запуталась. Вот пример : <a href="#"<img alt="" src="img/cart.png" width="66px" height="59px" /></a> Это что-то типа картинки/баннера со ссылкой, не суть. Я не понимаю, откуда он берет значения ширины и высоты? Не из головы же он прописал именно эти цифры? Я повторяю каждое его действие на своих картинках…
0 votes3 answers -
как растянуть элемент по высоте родителя?
верстаю страницу табличной версткой и столкнулся с проблемой. В ячейку <td id="wrap" colspan="2" rowspan="2"> не могу вставить таблицу или див, так, что бы она (он) занимал всю высоту родителя (#wrap). http://jsfiddle.net/dennila2/Lt3L0jw6/ Объясните пожалуйста, как это сделать?
0 votes10 answers -
Google Fonts, шрифт Roboto, проблема с кириллицей в не WebKit браузерах
Пожалуйста, подскажите: Решил использовать в шаблоне шрифт Roboto, подключил код от Google <link href="//fonts.googleapis.com/css?family=Roboto:100italic,100,300italic,300,400italic,400,500italic,500,700italic,700,900italic,900" rel="stylesheet" type="text/css">Шрифт необходимо применить к кириллическому тексту. Столкнулся со странным багом: во всех WebKit браузерах (Chrome, Opera, Яндекс.Браузер и т д) шрифт применяется нормально, как к кириллице, так и к латинице. А вот в IE и Firefox только к латинице, а кириллицу игнорит. Чтобы с этим такое сделать?
0 votes2 answers -
Плавный полупрозрачный фон с затуханием
У меня есть блок фиксированных размеров с ссылками и простым текстом. Подскажите пожалуйста как сделать: - что бы только фон блока (в примере - желтый цвет) был полупрозрачный, а всё что в самом блоке (ссылка и текст) были нормальные БЕЗ прозрачности - чтобы фон блока справа плавно затухал, например 10-30 пикселей плавного затухания, причём и при наведении и без наведения его правая грань плавно затухала (растворялась). Вот только что я сумел сделать - http://jsfiddle.net/kn4k4bqh/
0 votes11 answers -
Смещение текста в разметке
Здравствуйте! Начал писать сайт в PHP дизайнере и столкнулся с такой проблемой. При настройке стилей css с блоками div. Запускал в Explorer все нормально. В Опера смещается вниз текст. Рассматривал в инете, не получилось. Заранее спасибо. https://yadi.sk/i/v6gfCIPLd48vA https://yadi.sk/i/JT3U6p5Jd48vC
0 votes1 answer -
Перенос строки с одинаковым отступом
Привет, подскажите плиз,имеется код: </ul><li class="item-150"><a href="/seminary-s-partnerami">Семинары с партнерами</a></li></ul>Так как у меня ширина не позволяет, слово партнерами переносится на новую строку: * Семинары с партнерами А как сделать, чтобы слово партнерами было ровно под словом Семинары?
0 votes2 answers -
Помогите расположить скрипты в горизонтальном положении на странице
Доброго времени суток. Такая проблема, нужно расположить этот код(эта кликабельная картинка с кликабельной подписью под ней) в горизонтальный ряд. Таких контейнеров у меня 5, но на странице они идут только сверху в низ, а нужно чтобы шли горизонтально. Пробовал этот вариант - http://htmlbook.ru/faq/kak-razmestit-elementy-spiska-gorizontalno , не помогло. Вот код. Заранее благодарен. <style style="font-size: 12">figure.img { margin: 0; text-align: center;} figure.img img { max-width: 100%; height: auto;}figure.img figcaption { padding: 0 1%; font: italic 90% Georgia,serif;}</style><figure class="img"> <a href="...."><img alt="...." src…
0 votes5 answers -
Смещение текста
Здравствуйте! Начал изучать создание интернет магазина. Пишу с помощью php дизайнера. И столкнулся с такой проблемой. Смещается текст в блоке header. Не могу сделать чтобы было одинаково во всех браузерах: Opera, Explorer, Mozilla и т.д. Заранее спасибо! http://itmages.ru/image/view/2082446/5bdf089e http://itmages.ru/image/view/2082436/4c08e429
0 votes3 answers -
CSS Parallax - откуда-то появляется горизонтальный скрол
Здравствуйте! На одной из страниц, которую я сейчас пытаюсь сверстать есть Parallax-эффекет. Я добился того, что он работает, но вылезла проблема: откуда-то появляется горизонтальный скролл, хотя инспектор показывает размеры элементов верные. Разметка страницы: <div class="card"> <div class="image"> <!-- Image --> <img src="..."> </div> <div class="info"> <!-- Information --> </div></div>Стили: .card { height: 100vh; perspective: 1px; overflow-y: auto; overflow-x: hidden; perspective-origin: top center; background: white;}.image { transform: translateZ(-1px) scale(3);…
0 votes0 answers -
Наложени при position: absolute
Добрый день. Подскажите пожалуйста со следующим моментом: нужно, что бы надпись была чуть выше картинки . Картинка в одном <div>, Текст во втором. Я для div'а с текстом задаю position: absolute; left:60%; top: -20px;В полноэкранном режиме все нормально, но если начинаю ресайзить текст наплывает на картинку Как можно это побороть?
0 votes8 answers -
Выравнивание ряда картинок по вертикали
Внизу сайта http://teplogid18.ru/ есть картинки http://joxi.ru/812MkDqU4Ea1rJ Как их выровнять по одной линии? http://joxi.ru/DBA0wpPfBQO42y
0 votes3 answers -
Макеты с исходным кодом
Здравствуйте! Подскажите пожалуйста, где можно скачать psd макет сайта и его исходный код чтобы видеть как в том или другом месте сверстано и сравнивать свое. Заранее благодарен!
0 votes4 answers