Arhn - архитектура программирования

Bootstrap Navbar, с логотипом, центрированными ссылками, не остаются вертикально выровненными после изменения размера окна

Хорошо, я пытаюсь использовать API начальной загрузки для адаптивного дизайна, однако я думаю, что начал не с той ноги. Итак, у меня есть проблема. Вы можете посетить мой сайт по адресу http://www.nationalbloodservicemt.we.bs и четко понять суть проблемы. у меня есть.

Проблема 1. Во-первых, центрированные ссылки и значки социальных сетей не выровнены по вертикали с логотипом, и я не могу заставить их правильно выровняться даже с элементом .nav со свойством встроенный блок.

Проблема 2. После изменения размера окна и запуска начальной загрузки, когда запускаются медиа-запросы, когда окно возвращается в полноэкранный режим или больше, чем указанный медиа-запрос, элемент .nav-collapse не может позиционировать себя встроен в логотип, вместо этого он идет прямо под ним.

Как я могу исправить эти проблемы? Также у меня есть отдельный файл для пользовательской таблицы стилей, которая переопределяет некоторые элементы начальной загрузки. Должен ли я просто редактировать bootstrap.css напрямую? (Это лучшая практика?) Извините, я новичок в начальной загрузке.

css twitter-bootstrap
16.06.2014

  • Можете ли вы попытаться закомментировать свою таблицу стилей, которая переопределяет загрузку, и посмотреть, сохраняется ли ваша вторая проблема? И нет, НЕ редактируйте bootstrap напрямую. Это нехорошая практика! :) 16.06.2014
  • Привет @domdev, я закомментировал все пользовательские css, и они все еще сохраняются. Итак, я спросил, потому что мне довольно сложно понять, какой стиль в bootstrap css переопределяет мой стиль. Затем я в конечном итоге использую !important, что, как я слышал, в некоторых случаях является злом. 16.06.2014
  • Если вы поместите свою таблицу стилей CSS после таблицы стилей начальной загрузки в своем документе, вам не нужно переопределять !important. 16.06.2014
  • Вы также должны реализовать панель навигации, как это предлагается на сайте Bootstrap. Я вижу, что вы используете немного другую разметку. См. здесь: getbootstrap.com/components/#navbar 16.06.2014
  • Спасибо за этот совет. Тогда хорошо знать 16.06.2014
  • Ой. Разметка взята из примера макета и называется блоком-героем. Я выбрал это, так как это казалось одним из самых простых макетов, который можно легко настроить (по крайней мере, я так думал..) 16.06.2014
  • @domdev, интересно не то, что если я переключаю (выключаю и снова включаю) атрибут position: absolute !important; для элемента `.nav-collapse.collapse` из инструментов chrome dev, он вступает в силу и позиционируется соответствующим образом. Что странно .. есть идеи? 16.06.2014

Ответы:


1

Я применяю выравнивание navbar-collapse, добавляя float: left к элементу логотипа. Я не полностью проверял это и может быть полным провалом или, по крайней мере, иметь некоторые последствия. но пока сойдет. Если у кого-то есть лучшее решение/обходной путь, мне интересно об этом узнать.

16.06.2014
Новые материалы
Коллекции публикаций по глубокому обучению
Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..
Представляем: Pepita
Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..
Советы по коду Laravel #2
1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..
Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..
3 способа решить квадратное уравнение (3-й мой любимый) -
1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..
Создание VR-миров с A-Frame
Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..
Демистификация рекурсии
КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..