Перейти к содержимому

Как убрать отступ у последнего элемента css

  • автор:

Как у последнего блока убрать margin-bottom.?

Всем привет, вопрос очень простой но я что-то туплю.
Как у последнего блока убрать margin-bottom ?

То что я сделал, но не срабатывает, так как до div блока есть тег (a).
На данный момент у всех div убрало margin-bottom. а надо только на последнем.
https://jsfiddle.net/x5yb0qgz/2/

  • Вопрос задан более трёх лет назад
  • 360 просмотров

Комментировать
Решения вопроса 1

wapster92

WapSter @wapster92 Куратор тега CSS

a:last-child .gbd

Ответ написан более трёх лет назад
Нравится 2 1 комментарий

ws17

Антон Вебсайтовский @ws17 Автор вопроса
О, спасибо, я чет и не подумал что так можно сделать.
Ответы на вопрос 1

Seasle

Александр @Seasle Куратор тега CSS

Дополню ответ. Всё зависит от ситуации. Первый вариант Вам уже показали, а есть еще второй вариант развития событий (через selector + selector ). К примеру во флекс-контейнере ( margin ‘ы не схлопываются) и первый вариант не будет работать так, как Вы ожидаете:

Ответ написан более трёх лет назад
Комментировать
Нравится Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

javascript

  • JavaScript
  • +3 ещё

Как сделать ограничитель поля символов?

  • 1 подписчик
  • 2 часа назад
  • 34 просмотра

Как убрать отступ у последнего элемента css

Для того, чтобы убрать отступ у последнего элемента, например в списке, можно воспользоваться псевдоклассом :last-child .

Рассмотрим пример. Имеется маркированный список, в правилах css задан отступ снизу у каждого элемента li в 10px;

  123 456 789  
li  margin-bottom: 10px; > 
li  margin-bottom: 10px; > li:last-child  margin-bottom: 0px; > 

Отступ после последнего li в ul. Как убрать? [дубликат]

Проблема в ширине ul. Откуда берется отступ после последнего li в ul? Все padding и margin справа на нуле. Как можно убрать?

Отслеживать
задан 17 мая 2019 в 10:48
RedLionHeart RedLionHeart
73 1 1 серебряный знак 7 7 бронзовых знаков
Надо пример кода, желательно на jsfiddle или чем-то подобном.
17 мая 2019 в 12:19

3 ответа 3

Сортировка: Сброс на вариант по умолчанию

Если нужна выборка именно последнего элемента вы можете воспользоваться псевдоклассом last-child

:last-child < // тут ваши стили >

Так же советую вам почитать про выборку с помощью псевдокласса nth-child()

Подробнее про last-chiild

В целом про псевдоклассы

Отслеживать
ответ дан 17 мая 2019 в 14:35
user298256 user298256
тут скорее вопрос про сам ul, нежели про последний li
17 мая 2019 в 15:20

введите сюда описание изображения

Не совсем понятно о каком отступе после последнего li идет речь, т.к. на скрине показан лишь весь список целиком. Если речь идет об этом пустом пространстве:

То с чего вы взяли, что это отступ? У вас указана фиксированная ширина для списка в 62.5% и это, вполне возможно, просто пустое пространство, не заполненное элементами списка, которые, скорее всего (судя по скрину) так же сделаны через float:left . Чтобы дать более точный ответ на вопрос нужно смотреть на стили самих li и родительского элемента в котором лежит ul . Если задача стоит в распределении всех элементов li равномерно по всей ширине ul то можете использовать следующие стили для вашего элемента ul :

.main-nav

А если задача укоротить сам ul то просто сделайте ему меньшую ширину.

Как убрать отступ сверху css

В CSS отступ сверху можно сделать с помощью следующих свойств:

  • padding-top — установка внутреннего отступа
  • margin-top — установка внешнего отступа

Основное отличие в том, в какую сторону направлен отступ. При использовании padding отступ будет внутри блока, следовательно, контент в блоке будет сдвинут на то значение, которое указано в свойстве. При использовании margin отступ создаётся от всего блока. Оба свойства можно использовать одновременно, создавая и внутренний и внешний отступ для элемента

.content  margin-top: 20px; > 

Чтобы сбросить отступ, необходимо указать значение 0 нужному типу отступа:

.content  padding-top: 0; > 

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *