kask

Сетка bootstrap4

Recommended Posts

Добрый вечер! Помогите пожалуйста понять почему  при использовании сетки у меня вторая колонка не отображается пока ей не поставишь ширину 100%?  Разве она не должна подстраиваться под размер автоматом? вот мой код https://jsfiddle.net/gzf1hkc0/  в нем navbar с двумя колонками. проблема со второй колонкой. пс. в коде уже стоит ширина второй колонки 100%, но как я понимаю самому прописывать ее не надо и раз так может я что то не так сделал? заранее спасибо за то что уделили внимание моему вопросу)   

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 dron
      Всем привет. Никак не получается сверстать нормальную Pricing Table на Uikit 3. Я только вникаю в тему, поэтому, может еще не догоняю.
      Пробую сделать на uk-flex + uk-table. Постоянно какие-то косяки то с адаптивностью, то с шириной, то с высотой колонок...
      <div class="uk-flex uk-flex-center"> <div class="uk-card uk-card-default"> <table class="uk-table uk-table-divider bg1"> <thead> <tr> <th>Тестовая таблица 1</th> </tr> </thead> <tbody> <tr> <td>Поле 1</td> </tr> <tr> <td>Поле 2 пошире</td> </tr> <tr> <td>Поле 3 еще шире чем поле 1 и 2</td> </tr> <tr> <td>Тестируем поле 4, которое воообще широкое</td> </tr> <tr> <th>100008 руб</th> </tr> </tbody> </table> </div> <div class="uk-card uk-card-default uk-margin-left"> <table class="uk-table uk-table-divider bg1"> <thead> <tr> <th>Тестовая таблица 2, таблица 2, таблица 3</th> </tr> </thead> <tbody> <tr> <td>Поле 1</td> </tr> <tr> <td>Поле 2</td> </tr> <tr> <td>Поле 3</td> </tr> <tr> <td>Поле 4</td> </tr> <tr> <td>А тут есть еще поле 4</td> </tr> <tr> <td>А еще поле 6, которое шире других</td> </tr> <tr> <th>12 000 ₽</th> </tr> </tbody> </table> </div> <div class="uk-card uk-card-default uk-margin-left"> <table class="uk-table uk-table-divider bg1"> <thead> <tr> <th>А тут таблица номер 3</th> </tr> </thead> <tbody> <tr> <td>Поле 1</td> </tr> <tr> <td>Широкое поле 2 из таблицы 3</td> </tr> <tr> <td>Поле 1</td> </tr> <tr> <td>Поле 1</td> </tr> <tr> <td>Поле 1</td> </tr> <tr> <td>Поле 1</td> </tr> <tr> <th>9 000 ₽</th> </tr> </tbody> </table> </div> </div>
      И как на зло не могу ничего найти подходящего уже готового. Ни в шаблонах на Uikit, ни в документации... Кто-то верстал Pricing Table на Uikit 3? Можете помочь, показать свой код?

      Заранее спасибо!

    • By victorius
      при ширине экрана @media(max-width:768px) в самый низ страницы верстки есть слайдер внутри него есть контент с картинкой хочу поместить картинку за границы слайда сверху но картинка обрезается. как сделать чтобы было видно
      ссылка на верстку  http://frontend-er.h1n.ru/asia-spa/
       

  • Member Statistics

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

    No registered users viewing this page.

  • Спрашивают сейчас

  • Пишут сейчас

    • сделал класс narrow чтобы уменьшить ширину, но на место не возвращается блок читал что ширина сетки 960px, а в шаблоне ширина 1140px
    • Потому что 1-й блок не имеет отступа слева. А 4-й имеет, из-за чего доступная область на втором рже меньше.
      В связи с этим последний блок "перескочил" на следующую строку только потому, что ему не хватает места.
    • <div id="openModal" class="modalDialog"> <div> <a href="#close" title="Закрыть" class="close">X</a> <h2>Обратная связь</h2> <form name="MyForm" action="#openModal" method="post"><br> <input name="name" style="width: 420px" type="text" placeholder="Ваши фамилия, имя, отчество" /><br> <input name="tel" style="width: 420px" type="tel" placeholder="Ваш номер телефона" /><br> <input name="email" style="width: 420px" type="email" placeholder="Ваша электронная почта" /><br> <textarea name="body" style="width: 420px" placeholder="Ваше сообщение"></textarea><br> <br>Нажимая на кнопку "Отправить", я даю согласие на обработку своих персональных данных в соответствии с <a href="politika.htm" target="_blank">Политикой конфиденциальности</a><br> <p style="text-align: center"><input type="submit" value="Отправить" id="btnpng4" /></p> </form> <?php if (isset($_POST["email"]) || isset($_POST["tel"])){ if (isset($_POST["name"])) {$name = $_POST["name"];} if (isset($_POST["tel"])) {$tel = $_POST["tel"];} if (isset($_POST["email"])) {$email = $_POST["email"];} if (isset($_POST["body"])) {$body = $_POST["body"];} if(empty($email) or empty($name) or empty($body)){   //отправка сообщения на email } else if(empty($tel) or empty($name) or empty($body)){   //отправка сообщения на tel } else{   //вывод предупреждения, что не заполнены обязательные поля } комментарии    
      Заменить на соответствующий код который будет выполнять эти действия
  • Popular Contributors