Svetlana_P

Задайте высоту блоку или добавьте контент. Если у блока не задана высота, то по умолчанию у нее значение auto. Т.е. определяется исходя из контента. Поэтому, если контента нет, то и высота — ноль. Поэтому фон и не видно. Как его может быть видно, если высота — 0 px. PS Вы бы выкладывали код в песочницу и давали ссылку. Чтобы участникам форума было проще Вам помогать, а Вам быстрее получать помощь.

alshend, npofopr, Шамиль — всем большое спасибо! Пошла разбираться > Вообще тема поста другая Действительно, на основной вопрос по теме уже получила ответ.

Спасибо большое, изучу! С первого наскока, правда, не разобралась. Шамиль, привет! Давно тебя не было слышно. Рада твоим 5 коп :))) Хорошая демонстрация. Я правильно поняла, что в source хранятся рабочие файлы, а в assets — готовые после компиляции? Кстати, можешь пжл перечислить свои теперешние инструменты? Я пока с Prepros

alshend, спасибо! А если пользуетесь шаблонизатором, то где файлы хранятся? Например, pug файлы? Господа, а почему такая организация считается, что "в одной куче"? Ведь здесь файлы вроде распределены по папкам. Что тут не так? npofopr, можете, пожалуйста, тоже показать свой вариант?

Понятно, тоже так стала делать. А можете, пожалуйста, показать структуру папок и файлов своего обычного проекта? Как Вы обычно делаете?

Да, видимо так будет проще всего. Спасибо!

Проблема со скриптом плагина simple lightbox. Самой решить не удалось. Подскажите направление, пожалуйста. Сайт http://borodin-art.ru/ Когда с мобильного устройства нажимаешь на фото, оно открывается во всплывающем окне. Но когда я пытаюсь фото там увеличить растягиванием (двумя пальцами), то не получается. Наверное, из-за того что через свайп работает переход к предыдущему и следующему фото? Это между собой как-то конфликтует может? Или запрет стоит... Что обычно делают в таких случаях? Или проще плагин другой найти? Если что, вот урл скрипта http://borodin-art.ru/js/simple-lightbox.js

Привет! Ничего себе Впервые такое вижу... А что Вы хотели бы в замен? Я понимаю, что бесплатно, но всё же наверняка есть какие-то мысли. У меня, например, были бы вопросы, но вот просто так занятого человека дергать, без какой-либо отдачи, как-то неловко.

npofopr, спасибо! Стало понятнее

1. Как принято сдавать верстку, если пользуешься, например, pug и sass? До их появления я предоставляла html, css и т.п. Сейчас осваиваю инструменты, но из-за компиляции непонятно, какие файлы теперь отправляют клиенту? 2. В каком виде готовую верстку закачивают на сервер? Например, сайт без CMS: просто готовые html+css+js? Но тогда их менее удобно править при необходимости. Или на сервер как-то компилятор ставят? А если натягивать на CMS, то тогда как быть? Чувствую, для большинства участников форума это очевидные вещи. Подскажите, как хотя бы называется эта тема, чтобы погуглить. Всё, что находила сама — не по теме.

AlexZaw, там реально цифры мигают, я проверяла. Но калькулятор на php, а я в программировании почти ноль, поэтому не разобралась, где там что менять. Вот демонстрация проблемы

Сборку вижу, но где сами-то файлы?) можешь архивом мне скинуть, например в ЛС

Скинь файлы, попробую глянуть, что у меня получится

Какие письма не приходят? И какой плагин? Можете написать мне в ЛС, что нужно сделать. Посмотрю, в моей ли компетенции, и отвечу.

Скорее всего, какой-то блок вылезает по ширине из общего контейнера. Надо смотреть, какой именно) А так да, в целом — на телефоне надо больше тестировать и править мелочи.

Покажите текущую верстку

Посмотрела бегло, заметила мелочи. Если смотреть с телефона, то справа появляется белая полоска. Т.е. там сайт идет не на всю ширину. Под кнопкой "Заказать оценку" декоративная волнистая полоска. На телефоне под ней появляется еще одна — тонкая и сплошная. У оранжевых блоков-стрелках раздела "Как мы работаем" на телефоне появляются вертикальные полоски. В блоке НЕЗАВИСИМАЯ ОЦЕНКА ИМУЩЕСТВА есть фоновая картинка с весами, от нее идут в стороны косые линии. На телефоне, при некоторых размерах, линии сильно расплываются. Ссылки в блоке под "НАШИ УСЛУГИ ПО СОПРОВОЖДЕНИЮ СДЕЛОК M&A" скачут влево при первом наведении (смотрю в хроме). В блоке "КАК МЫ РАБОТАЕМ" шрифт немного скачет — буква "п" странная. Тексты хорошо бы оттипографить и исправить опечатки. Местами не совсем понятны названия классов. Например, кнопка "Отправить" носит класс .btn и обернута в .button-wrapper. А кнопка "Заказать сопровождение" тоже с .btn, но обернута в .btn-wrap. Стили оберток зависят от родительских контейнеров, это видно в CSS. Но как-то это всё мало вяжется с БЭМ, по которому, как я вижу, организовывали большую часть стилей.

Посмотрела сайт. Он ведь на Bootstrap сделан. Это фреймворк такой, почитайте про его сетку. Там уже реализованы колонки. В текущем коде перед контактами я вижу уже кто-то описал две колонки — два дива с классом col-lg-6 внутри дива row. Задайте такую же разметку для контактов. Поставьте нужный контент в эти колонки, и не надо ничего самому придумывать. Т.е. структура такая будет: <div class="row"> <div class="col-lg-6"> Здесь контакты номер один </div> <div class="col-lg-6"> Здесь контакты номер два </div> </div> Дополнила: вот скрин, всё встает как надо

Если на две колонки надо разбить только текст, то есть свойство column-count. Можно настроить количество колонок, отступ между ними, полоску при желании добавить. https://www.w3schools.com/css/css3_multiple_columns.asp https://developer.mozilla.org/ru/docs/Web/Guide/CSS/Using_multi-column_layouts А в целом, создать две колонки можно можно разными способами (через float, flex, grid...), в зависимости от задачи. Лучше пришлите ссылку на сайт или покажите весь код.

Вот так работает https://jsfiddle.net/Benedetta/foetr995/ Но наверняка можно сделать умнее. Покажи потом, к чему пришел в итоге

Да, из-за Bootstrap. Правило не срабатывает, потому что оно имеет меньшую специфичность (т.е. "приоритетность"), чем родное бутстраповское. Если Вы не знаете, о чем речь, то советую почитать про специфичность селекторов CSS. Это важно. Что можно сделать? Вижу три варианта. 1. Добавить специфичности к правилу: так, чтобы применялось даже внутри navbar-default: 2. В файл бутстрапа залезть и там изменить правило, но я бы не стала. 3. Добавить еще к ссылке еще один класс, определяющий цвет

Попробуйте добавить скрипт <script> document.addEventListener('play', function(e){ var audios = document.getElementsByTagName('audio'); for(var i = 0, len = audios.length; i < len;i++){ if(audios[i] != e.target){ audios[i].pause(); } } }, true); </script> У меня сработало. Я в JS мало понимаю, но здесь вроде происходит следующее: скрипт смотрит на каждый трек в теге audio и ставит на паузу каждый, кроме текущего. А вот этот ставит на паузу именно текущий трек, поэтому, по идее, логичней <script> document.addEventListener('play', function(evt) { if(window.$_currentlyPlaying) { window.$_currentlyPlaying.pause(); } window.$_currentlyPlaying = evt.target; }, true); </script> Может еще что тут предложат более правильное PS Необычный сайт, что это за треки?)

Какой стиль — цвет текста? Так он же переопределяется правилом в navbar.less. .navbar-default .navbar-brand { color: #777; } Потому что спецефичность селектора .navbar-default .navbar-brand выше, чем спецефичность .navbar-brand. Или Вы про что?

1. Думаю, зависит от типа сайта. Но если Вы начинаете, то логично сверстать стандартно, просто чтобы сайт тянулся с 320 px до 1280 px. Научитесь до этого доводить. Изучите сетку фреймворка Bootstrap. 2. Не делала, поэтому не скажу, но почитаю ответы других) Вас может заинтересовать статья по теме https://webformyself.com/optimizaciya-veb-sajtov-pod-bolshie-ekrany/ 3. Правильно написали выше, в хроме есть инструмент. Нажмите F12, потом иконку телефона, и слева выберите Responsive. Тут показано https://developers.google.com/web/tools/chrome-devtools/device-mode/imgs/device-mode-initial-view.png 4. Не знаю лучший способ, тоже подожду ответы. Вообще, есть хорошие, но платные сервисы: https://www.browserstack.com, https://crossbrowsertesting.com/ , http://saucelabs.com/. Других или бесплатных не знаю. Но зависит от требований проекта, не везде это необходимо.

Раз мы уже в Зазеркалье, то как вариант http://benedetta.ru/project26/О нас - Petpoint.html Текст, т.е. вторую "картинку", поставить через position: absolute и задать фиксированный отступ слева. Тогда будет как будто две колонки. .article-text p { position: relative; } .article-text p img:last-child { position: absolute; left: 200px; } Но тексты действительно удобнее сделать стандартным способом, а не картинкой. Иначе этот блок не будет сужаться при меньших размерах экрана. И прописать через медиа запрос, чтобы в определенный момент текст съезжал под картинку.