VeraVostro

Newbie
  • Content count

    12
  • Joined

  • Last visited

Community Reputation

1 Обычная

About VeraVostro

  • Rank
    Новичок

Information

  • Sex
    женский
  • From
    Харьков

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Заранее прошу прощения если этот вопрос уже задавался, но, несмотря на обширное кол-во информации по теме, найти ответа на свой вопрос я не смогла. Суть в следующем: Например, у меня есть два отдельных scss файла - header.scss и footer.scss. Стили футера почти полностью совпадают со стилями хедера, за исключением пары свойств. Но если я прописываю в файле footer.scss @extend header - стили хедера не могут использоваться, т.к. это другой файл. Подскажите, как идеологически вернее делать в данной ситуации? Чтобы новый класс/элемент получал стили существующего класса из другого файла + добавлял свои или менял некоторые стили на свои.
  2. Александр, спасибо! Ссылку поправила, должна работать. А как это реализовать с помощью бутстрап? так же адаптив будет удобнее делать... И верстка с помощью float - вроде бы ж уже не самый современный и удобный вариант?.....
  3. Прошу прощения за мой дилетантский вопрос: Есть макет сайта вот такого плана (картинка во вложении). Все блоки на сайте размещены сеткой, у каждого блока высота равна или x, или 2x, или 3x, ширина тоже - y, или 2y. Пробую сделать на Bootstrap, но, из-за высоты, бутстрап размещает 4-й блок не под 2-м, а под первым, с новой строки. Пример: https://www.codeply.com/go/dwyEv5gprw Подскажите, как решить данный вопрос? Заранее спасибо!
  4. Проблема решена. За пределы контента выпирало .head .left:before
  5. Помогите, пожалуйста, очень нужен взгляд со стороны. Проблема следующая - страница нормально отображается в десктопной версии, при ресайзе окна - тоже все ок. Но в режиме эмуляции моб. устройств ширина экрана больше чем ширина содержимого страницы. При этом проблема только в chrome firefox отображает нормально в любом режиме. Ниже скрин (режим моб. устройств). Код можно посмотреть здесь.
  6. Спасибо, я тоже уже заметила и исправила.... Меня изначально дезинформировало то, что в папке с файлами, скачанной на оф. сайте Masonry нужный для подключения файл с js лежал не в папке js, а рядом с файлом index
  7. При настройке Masonry возникает проблема: ширина блоков регулируется отлично (и в %, и в px), но, когда возникла необходимость сделать один из блоков в 2 раза выше остальных блоков - низкие блоки не занимают пустое место рядом с высоким блоком и получается то что на картинке ниже. Перепробовала, как мне кажется, все: в инициализации указывала ширину колонки в пикселях, в процентах, добавляла в код grid-sizer, убирала grid-sizer........... Методом тыка поняла что если увеличить у меня в css ширину блока .grid-item - то колонок становится две - и в таком случае Masonry красиво все располагает. Код здесь (постаралась оставить только суть).
  8. Правило height: 100%; так не работает. Картинку, выравненную таким образом, будет сложно расположить, как требуется. Тем более, для данной ситуации лучше всего подходит фон (изображение выполняет декоративную функцию). При помощи функции calc() и при известной ширине контейнера можно рассчитать точное значение отступов контейнера, либо требуемую ширину картинки и ::before элемента. Но, не думаю, что использование псевдоэлементов является хорошим решением. Что касается решения вопроса с помощью псевдоэлементов - это первый вариант, который мне на "Тостере" посоветовали. На данный момент - единственный вариант, который справляется со своей задачей. На мой взгляд, вариант с пседоэлементами - немного "костыли", но, повторюсь, единственный и с задачей пока справляется... Я его уже применила, кому интересно - вот тут можно посмотреть файлы (пока без адаптива). С удовольствием выслушаю комментарии/критику/замечания/мнения.... Я теперь с замиранием сердца жду момента когда все это буду переносить на WP и боюсь что там все это поломается.
  9. Alanreid, большое спасибо за такой обстоятельный ответ и помощь )) Прикрепляю полный макет (к сожалению, в прошлый раз при отправке обрезался почему-то). Но там основная проблема, которую я не знаю как решить - это чтобы при уменьшении размера окна на экране оставалась только средняя часть с контентом, а боковые поля (без текста) постепенно уменьшались бы и потом вообще пропадали на небольшом экране.
  10. Предположение что нужно обернуть весь контент во #wrapper? Я считаю что это имеет смысл, чтобы по бокам wrapper остались поля, которые будут уменьшаться, а потом и пропадут в процессе уменьшения экрана. Вы считаете что это не нужно? Как нужно сделать по-вашему? Я с удовольствием узнаю все мнения и предложения по своему вопросу.
  11. Добрый день! Подскажите, как расположить блоки таким образом как на картинке. Текстовые блоки, я думаю, можно разместить с помощью Masonry. И напрашивается обернуть эти блоки во #wrapper, разместить его посредине...... Но как быть с моментом что в таком случае фон блоков выходит за пределы #wrapper? Тут же уже не получится задать background для body и размещать весь контент внутри wrapper?....
  12. VeraVostro

    VeraVostro