Как убрать пустое пространство под сложной формой?
и когда все элементы выстроены нужным образом, под всей формой замечаю огромное количество пустого места, которое прокручивается до конца страницы сайта. В чём я не так пишу стили, почему появляется это пустое место? Подразумеваю что место от первоночального расположения элемента на странице, но я ведь его разместил при помощи css, почему оно осталось?
Отслеживать
51.4k 87 87 золотых знаков 267 267 серебряных знаков 505 505 бронзовых знаков
Убрать пустое пространство над/под заголовком Blogger
Tanka А как убрать пустое место над шапкой? Я скрыла панель над шапкой, теперь там пустая полоса, а хочется чтобы картинка в шапке понялась вверх 🙂 NMitra Я думаю, что где-то должен быть указан этот параметр. Но я пока не нашла где именно.
Можно поступить по-другому — поднять заголовок:
.header-outer margin: -2.3em 0em 0em 0em;
> NMitra Я поняла в чём дело. Вы не удалили, а, как правильно указали, скрыли панель навигации. Поэтому появилось пустое пространство на месте, где она должна находиться. Поднять заголовок в этом случае единственное решение. Или Navbar нужно удалять. Tanka Спасибо! мне понравился вариант с навбаром внизу =) сделаю так NMitra Да, мне тоже нравится.) К сожалению, это не решит проблемы с пустым пространством наверху. Tanka А код
.header-outer margin: -2.3em 0em 0em 0em;
>
тоже вставлять нужно перед
]]> ?? Tanka ))) Ой поняла, добавила параметры после .header-outer
Спасибо большое — все получилось! =) NMitra Отлично))) Tanka Решила проверить блог в IE шестом, так там пустое место все равно есть над шапкой, да и все там наперекосяк (( В Опере все ОК. NMitra К сожалению, сами разработчики платформы Blogger говорят о плохом качестве отражения в IE 6. Я тоже была несколько обескуражена видом блога.
Можно ещё немного увеличить значение
.header-outer margin: -2.5em 0em 0em 0em;
> Tanka Спасибо, попробую. Я бы не заморачивалась, но треть моих посетилей пользуется IE, а там моя боковая панель вообще ужасно смотрится (( NMitra Здесь зависит и от используемой версии IE. Некоторые всё же устанавливают себе обновления. Филипп Гаврилов Великолепно! Спасибо за решение NMitra Да, в комментариях больше полезной информации оказалось, чем в самой статье))) Хозяин Лягушатника А как удалить пустое пространство между сообщениями блога и нижними виджетами?
Что-то я уже слишком много вопросов вам задал))) NMitra Да, не мало))). После выходных посмотрю.
Значение -60(внешняя граница футера) и -30 (внутренняя граница футера) измените на своё. Mich Спасибо, Вам, NMitrочка, за Ваше трудолюбие и тщательность! Не перестаю Вами восхищаться!
Обновил IE до 9-ки. Всё равно блог в нём отображается не корректно: правый край текста сообщения рваный, новый фавикон не работает, полупрозрачный фон сообщений показывается как просто прозрачный! Вся красота на смарку.. ((
Вообще, конечно, большое «Г» этот IE, несмотря на 9-ю версию! Люди. Переходите все на продвинутые браузеры! Не смотрите наши блоги в Интернет Эксплойрере. 🙂 Mich О! Нашёл у Вас про фавиконы! А думал, что нет (как-то не попадалось раньше) и поэтому нарисовал себе иконку в Paint и прикрутил её, как было написано в другом блоге.. Теперь пошёл изучать. 🙂
Может и про полупрозрачность фона для IE у Вас где-то есть? ) В поиске не нашёл..
П.С. В комментах к «фавикону» прям настоящая битва с браузерами за правильное отображение иконки. 🙂 Напоминает, по поиску решений, сериал «Доктор Хауз» )) NMitra Я впервые глянула на блог из IE 6. Вот там действительно ужас. Я даже на некоторое время дар речи потеряла. И ведь некоторые его используют и не обновляют до более новой версии.
А вот насчёт прозрачности и правда нехорошо. И почему этот момент не предусмотрели разработчики? Подумать надо. NMitra Вот решение: перед ]]> добавить:
.post-outer background: transparent url(http://www.blogblog.com/1kt/travel/bg_black_50.png) repeat scroll top center;> Мич Урра. Заработало. Огромное спасибо, Наталья! Вы просто кибер-волшебница! 🙂 Убрал своё rgba, которым я до этого пытался регулировать полупрозрачность — работает и без него в четырёх основных браузерах! Поставил 60.png в Вашем коде — получилось чуть темнее, как раз «самый самолёт»! 🙂 Как говорит Е.Гришковец «А настроение-то улучшилось»! А скажите, пожалуйста, есть ли на этом чудесном сайте blogblog ещё и цветные полупрозрачности? И как там посмотреть все варианты? Я когда его набираю, выскакивает «404» (( Я так предполагаю это к нему идёт обращение для трансляции полупрозрачности? Совсем не разбираюсь в этом.. NMitra Я это решение подглядела в самом Blogger из шаблона «Путешествие». Я тоже не могу зайти на сервис. Введите в поиск
он выдаст несколько вариантов. Например этот: http://www.blogblog.com/1kt/transparent/white80.png Violetta А у меня не выходит(( http://med-lazer.blogspot.com/
Может, я вас не так поняла, вы имеете в виду пространство между заголовком сообщения и самим сообщением? У меня оно не убирается. На самом деле мне кажется, что он просто не хочет воспринимать тег head, который я туда впихнула, и отображает его как пустое пространство:) Хотя в другом блоггеровском блоге всё отлично. NMitra Ой! А зачем вы ещё один head добавили? Он в шаблоне уже существует и должен быть только один. Посмотрите эту статью http://shpargalkablog.ru/2010/07/kontent.html. MonCTeP Уважаемя NMitra может вы поможете. Посмотрите пожалуйста, хочу чтоб кнопки Share и твитнуть были на уровне зоголовка, а они у меня ниже. может поможете? http://zarabotaiipotrat.blogspot.com/ NMitra Код кнопок заключите в
и добавьте сразу после
Внесите стили перед ]]>
.knopki MonCTeP спасибо за помощь Starkkk Можно ли убрать описание, но так чтоб оно индексировалось поисковиками и не было пустого пространства на этом месте? NMitra Клоаккинг наказывается поисковиками. Starkkk Какой выход вы нашли для себя? NMitra Я оставила надпись только на Главной с помощью условных тегов. Starkkk Можно ли вместо названия поставить фото, но так чтоб оно индексировалось поисковиками и не было никаких нарушений? NMitra Здесь http://shpargalkablog.ru/2010/09/optimizatsiya-zagolovka-h1-h2-h3.html всё написано. По-хорошему, нужно убирать с заголовка h1, а картинке прописывать alt с нужной ключевой фразой, которая будет вести на главную. Starkkk По середине! Это не является клоакингом http://3.bp.blogspot.com/_ebKrCj8TLPk/TLLZcXEdALI/AAAAAAAAAwI/4bBCwpkfCWI/s1600/Logotip-Blogger.png Starkkk Это не риторический вопрос, прошу на него ответить NMitra Уже упустила нить разговора. Поисковый робот читает код страницы CTRL+U. Если в Blogger применяются условные теги http://shpargalkablog.ru/2011/02/uslovnye-tegi-v-blogger.html, то часть кода мы не увидим, то есть она не будет прочитана ни поисковиками, ни браузерами. Вот код, изменения выделены жирным
Что значит по середине? Это уже достигается с помощью стилей. Starkkk Как изменить цвет заголовка сообщений?
P.S. в редакторе можно изменить только размер NMitra Для блога «Мега интересно». Дизайнер шаблонов — Дополнительно — Заголовок сообщения. Под «Шрифт» можно установить текст жирным или курсивом. Рядом выпадающее меню, где выбрано 22px, измените, нажав на ▼. Анонимный Мне для «позитива» можно? NMitra Шаблон «Простая»? Там же. TtT да Starkkk Да NMitra Отыскали или скриншот нужен? Starkkk В «простом» такого нет 🙁 там только цвет ссылок менять можно NMitra h3.post-title font-size: 26px;
>
Скриншот: http://4.bp.blogspot.com/-dpd54A9X8S8/TsIBw27kAmI/AAAAAAAACgM/LoiAq1CHmo8/s1600/ScreenHunter_01%2BNov.%2B15%2B10.07.jpg Starkkk Как изменить ЦВЕТ заголовка сообщений? NMitra color: red; Starkkk Как убрать пустое пространство с левой стороны что бы получилось так: bigpicture.ru? NMitra Не поняла вопроса: с левой стороны относительно чего? Заголовка? Starkkk относительно экрана монитора. Заголовок, сообщения NMitra Я могу только предположить, что у вас монитор уже моего. Поскольку белое пространство присутствует в обоих случаях. Сделайте блог шире в «Дизайнере шаблонов»-«Регулировка ширины». Starkkk насколько сложно будет сделать например как в этом блоге totallycoolpix.com/2011/11/american-music-awards-2011/ Чтоб был маленький промежуток слева. Через регулировку длинны и ширины увеличивается размер правой колонки, но это никак не отражается на разрыве левой части. s005.radikal.ru/i212/1111/97/577a343205da.jpg
1. Хочу уменьшить размер разрыва NMitra Посмотрите здесь http://shpargalkablog.ru/2010/12/shirina-saita-css.html#rezinovye NMitra Нужно увеличить не правую колонку, а ширину всего блога. Starkkk Мне нужно не увеличивать блог, а убрать лишнее пространство слева. NMitra О, я поняла, что вы имеете ввиду:
.content-inner padding: $(content.padding) $(content.padding.horizontal);
>
.content-inner padding: $(content.padding) 0;
> Starkkk Вы чудо, спасибо. Se Nat на блоге очень много пустого пространства после сообщения, после коментариев, после контекстной рекламы и т.д.
Прямо поле пустых мест Как можно это урегулировать для чайника?
http://fotootcheti.blogspot.com/ NMitra Поле после сообщения
.post-footer NMitra Прижимает форму комментариев, в том числе количество комментариев
.comments NMitra С формой комментариев надо смотреть.
После контекстной рекламы где? Слева в боковой колонке? Снизу? Se Nat Спасибо за ответы, но если можно, для чайника объясните куда эти кода вставлять? .post-footer
и .comments
Еще раз спасибо за помощь!! NMitra Это код css, ответ есть здесь http://shpargalkablog.ru/2011/12/kak-izmenit-shablon-blogger.html NMitra Для пространства после формы комментариев http://shpargalkablog.ru/2011/06/stil-kommentariev-blogger.html Alekcey Nikolaev NMitra, помогите у меня появилаось пустое пространство между 1 и 2 постом, как убрать не знаю((( вот ссылка на блог http://afrika190.blogspot.ru/ NMitra Не увидела проблему, подробнее, пожалуйста, лучше со скриншотом. Анонимный как добавить в низу Технологии Blogger NMitra Добавить? Создайте новый блог, загляните в его шаблон в поисках приблизительно такого кода
Посмотрите его местоположение и добавьте аналогичным образом. Анонимный Нельзя просто этот код куда нибудь в конце кода?
просто в ориганале напинно шаблон simle. я хочу чтоб было просто технологии блоггер NMitra Добавьте гаджет «Логотип» на вкладке «Дизайн». Его предназначение то же. Анонимный А у меня в низу гаджеты расположены, я хочу чтоб технологии блоггер шли в самом низу после гаджетов. NMitra Добавьте гаджет HTML/JavaScript с кодом внутри
Ирина Малясова Добрый день, NMitra! Подскажите, пожалуйста, при внесении изменений в шаблон не вижу, где ставить галочку «Расширить шаблоны виджетов». Зато есть «Список виджетов». NMitra Здравствуйте, форматирование сменилось. Поставьте курсор на поле шаблона и нажмите комбинацию клавиш CTRL F. Вместо «Расширить шаблоны виджетов» слева рядом с нумерацией черные треугольнички, но их замучаешься раскрывать все. Анонимный Добрый вечер.
Убрала код навбара и сделала сохрание, сверху (вместо навбара) вылезло: TEMPLATE ERROR: Unknown runtime binding: includable in widget. Вернула код обратно и теперь избавиться не могу от этой надписи. NMitra Видимо прихватили что-то ещё. Посмотрите тут http://shpargalkablog.ru/2012/03/shablon-blogger-polomalsya.html Анонимный NMitra, лучи добра Вам!
Получилось самой избавиться от этого ужаса. Поковырялась в коде и нашла, что код дважды сам создался, который после кода Navbarа стоит. Стоял до и после него. До удалила и всё заработало.
И спасибо за эту статью. Подняла блог)) Hive Med А не подскажете, как уменьшить размер отступов от текста по краям шаблона и расстояние между сообщением и сайдбаром? А то довольно много места пропадает. Hive Med Дошел пока до такого:
Так можно? С виду вроде ок, но есть ощущение, что от отрицательных значений какая-то гармония в коде нарушается. NMitra Конечно, я сейчас уже не пойму в чём проблема. Минусы могут быть, я сама так раньше делала. Но лучше убирать без них. Sanirio Скрыла navbar. Подняла заголовок. Теперь на главной странице блога всё ОК. Но если зайти на страницу любого поста, то сверху всё равно есть отступ над шапкой блога, который хочется убрать. Как это сделать? Подскажите, пожалуйста! NMitra Каким образом удалили навбар, так http://shpargalkablog.ru/2010/07/panel-navigatsii.html#udalit ? Sanirio Да, так отключила. А затем убрала пустое пространство так:
body .navbar NMitra Я совсем запуталась у вас в шаблоне. Например, что это:
Почему meta находятся в body? Пространство над шаблоном образуется из-за
Sanirio Я не могу ответить на этот вопрос. Делаю изменения по руководствам, которые нахожу в Интернете, но сама с трудом разбираюсь что и как тут устроено.
Как удалить лишнее пустое пространство под изображением с помощью CSS
Самый простой способ избавиться от этой проблемы — изменить отображаемое значение изображения по умолчанию со строчного на блочное, т.е. применить стиль display: block; для изображения, как показано ниже:
Remove White Space Below Images .img-box < width: 125px; border: 4px solid #333; >.img-box img 
Читайте также
Похожие примеры:
- Как вертикально выровнять изображение внутри div с помощью CSS
- Как автоматически изменить размер изображения для размещения в контейнере div с помощью CSS
- Как применить границу к элементу при наведении курсора мыши, не влияя на макет в CSS
- Как разместить текст поверх изображения с помощью CSS
HTML и CSS, как убрать пустое пространство после текста что бы там был еще один текст и кнопка.
Как убрать пустое пространство под текстом
HTML код
CSS код
Нужно сделать как тут
Голосование за лучший ответ
задать правильные стили картинке и тексту.
У тебя текст съезжает из-за вставленной картинки
ivan DorofeevПрофи (619) 11 месяцев назад
Правильные это какие?
_ Искусственный Интеллект (761136) ivan Dorofeev, ну например, position: absolute;
ivan DorofeevПрофи (619) 11 месяцев назад
А с помощью display flex пофиксить не как нельзя?
_ Искусственный Интеллект (761136) ivan Dorofeev, нет
Ну тут как бы напрашивается такая структура. И тогда это будет легко описать стилями
Хочу быть блабла.
Можно картинку разместить перед заголовком и задать ей стиль float: right;
Похожие вопросы