VeraVostro

Как лучше сверстать блоки разной высоты на Bootstrap?

Recommended Posts

Прошу прощения за мой дилетантский вопрос:

Есть макет сайта вот такого плана (картинка во вложении).

Все блоки на сайте размещены сеткой, у каждого блока высота равна или x, или 2x, или 3x, ширина тоже - y, или 2y.

Пробую сделать на Bootstrap, но, из-за высоты, бутстрап размещает 4-й блок не под 2-м, а под первым, с новой строки.
Пример: https://www.codeply.com/go/dwyEv5gprw


Подскажите, как решить данный вопрос?
Заранее спасибо!

Макет.jpg

Edited by VeraVostro

Share this post


Link to post
Share on other sites
16 минут назад, AlexZaw сказал:

Таблиииичка!  Ссылка не работает, но что не так?

Александр, спасибо!
Ссылку поправила, должна работать.
 

А как это реализовать с помощью бутстрап? так же адаптив будет удобнее делать...
И верстка с помощью float - вроде бы ж уже не самый современный и удобный вариант?.....

Share this post


Link to post
Share on other sites
31 минуту назад, VeraVostro сказал:

И верстка с помощью float - вроде бы ж уже не самый современный и удобный вариант?

Удобный вариант означает достижение результата с наименьшими усилиями, в данном случае флоаты отработали бы так как вам нужно, у вас же сетка на флексах и для того чтобы блоки выстраивались так как вам нужно придется делать дополнительную обертку для блоков 2-5.

Первый блок не может находится одновременно на двух осях поэтому блоки 4-5 и переносятся на новую ось.

С бутстрапом не работал, но вроде в 4 есть возможность строить сетку на флоатах

39 минут назад, VeraVostro сказал:

так же адаптив будет удобнее делать...

С этим бы я тоже поспорил, но на вкус и цвет фломастеры разные

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Elizavetk_a
      Здравствуйте!
      Возникла проблема с реализацией одной идеи.
      Есть интерактивный объект с возможностью прокрутки городов. И есть фотографии, сделанные в виде  cards bootstrap 4. Необходимо, чтобы при выборе города выделялись определенные фотографии. Можете подсказать, как можно это реализовать в верстке, какие материалы изучить?
      Схематический рисунок прикреплен ниже. 
      Заранее спасибо)

    • By РоманФ
      Нужен наставник, интересует верстка, устал искать разрозненные знания в интернете.
      Естественно не бесплатно.
      Со своей стороны знаю где и как брать реальные заказы, (не про биржи фриланса). Уже работаю с заказчиками приходится использовать Addobe Muse, WordPress, параллельно работаю директологом.
      Ты научишь меня верстке. Если ты просто знаешь как верстать, и делаешь это хорошо и усидчиво, я помогу монетизировать тебе твои знания, а ты научишь меня верстке.
       
       
  • Member Statistics

    46,698
    Total Members
    3,128
    Most Online
    Dmitry3258
    Newest Member
    Dmitry3258
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.