Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 5.00/8: Рейтинг темы: голосов - 8, средняя оценка - 5.00
4 / 4 / 3
Регистрация: 14.10.2014
Сообщений: 323

Верстка в бутстрап. Блок уходит слишком низко, как его поднять?

03.09.2015, 09:51. Показов 1773. Ответов 5
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Первый раз верстаю в бутстрап, и тут же столкнулся с проблемой. Верхней строкой идет меню-с этим все в порядке. А следующий блок за меню, который должен идти ниже, уходит куда-то слишком низко, так, что даже появляется полоса прокрутки. Ошибок вроде нет. Помогите пожалуйста вернуть блок на место. Позиционирование не помогает.
Вложения
Тип файла: zip stolbim-bootstrap.zip (1.12 Мб, 3 просмотров)
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
03.09.2015, 09:51
Ответы с готовыми решениями:

Фиксированное меню опускает слишком низко
Читал, что можно задавать значение через scrollTop, но не пойму как. В общем при нажатии на соответствующий пункт сайта, он опускается на...

Слишком быстро уходит окно вывода
После компиляции слишком быстро уходит окно вывода, задерживаясь буквально на секунду. Прочитать что в выводе написано не успеваю. Как...

как поднять блок
* { margin: 0; padding: 0; } body { text-align: center; background: #fff; }

5
 Аватар для k-x
46 / 46 / 27
Регистрация: 19.05.2014
Сообщений: 117
03.09.2015, 10:11
Непонятное назначение margin-bottom: 142%;. Вот он и уходит вниз.
CSS
1
2
3
4
5
6
.navbar {
  position: relative;
  min-height: 40px;
  margin-bottom: 142%;
  border: 1px solid transparent;
}
1
4 / 4 / 3
Регистрация: 14.10.2014
Сообщений: 323
03.09.2015, 10:24  [ТС]
Спасибо, я нашел этот момент. Только как теперь исправить? Исправляю, сохраняю, но ничего не меняется. Вы извините, я новичок
0
4 / 4 / 3
Регистрация: 14.10.2014
Сообщений: 323
03.09.2015, 10:53  [ТС]
Исправил (перебил это правило). Теперь header нереальной высоты. Все марджины поставил 0. Помогите, пожалуйста. Спасибо заранее.
Вложения
Тип файла: zip stolbim-bootstrap.zip (1.12 Мб, 4 просмотров)
0
 Аватар для k-x
46 / 46 / 27
Регистрация: 19.05.2014
Сообщений: 117
03.09.2015, 11:07
а сейчас у h1 также огромные отступы указаны:

CSS
1
2
3
4
5
6
7
8
9
h1,
.h1,
h2,
.h2,
h3,
.h3 {
  margin-top: 142%;
  margin-bottom: 71%;
}
откройте в хроме свою верстку, нажмите F12 и исследуйте наводя на элементы какие стили им заданы.
1
0 / 0 / 1
Регистрация: 02.09.2015
Сообщений: 17
03.09.2015, 11:40
h1, .h1, h2, .h2, h3, .h3 {
margin-top: 1%;
margin-bottom: 1%;

Зачем такие большие проценты используете? margin лучше в пикселях или em - rem если бутстрап 4-й.
Как уже сказали выше, поиграйтесь с процентами, а лучше пропишите их в пикселях.

и font-size у вас в за 200% тоже не вижу смысла.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
03.09.2015, 11:40
Помогаю со студенческими работами здесь

Как поднять блок?
Есть блок, хочется, чтоб он был повыше-на уровне значка. есть предложения? ...

Как поднять блок над остальными?
Добрый вечер. Столкнулся с проблемкой.. Не могу поднять блок над остальными, как не мучался и позиционирование и индексы задавал, но его...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
Новые блоги и статьи
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве
8Observer8 02.02.2026
Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .
Философия технологии
iceja 01.02.2026
На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .
SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf
8Observer8 01.02.2026
Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .
SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли
8Observer8 30.01.2026
Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm
8Observer8 30.01.2026
Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .
SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 29.01.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .
Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT
bedvit 28.01.2026
Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .
SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 28.01.2026
Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru