Я пытаюсь добавить отступ после тега <details>, потому что следующий <p> в основном касается его ...

enter image description here

Я попытался добавить padding-bottom, но он просто увеличивает серый тег и не добавляет места ...

В настоящее время у меня есть следующие CSS:

// Start Drop Down Details
details {

    padding: .8em;
    background: #353535;
    border-radius: 20px
}

summary::-webkit-details-marker {display: none; }

details summary::before { 
    content:"►"; 
    padding: .7em;
}

details[open] summary::before { 
    content:"▼"; 
    padding: .7em;
}

Если вы хотите увидеть, как это выглядит вживую, вы можете увидеть это здесь: https://www.seekadventure.net/d/198-myog-backpacking-quilt-outdoorink

-1
searayman 3 Май 2021 в 00:41

1 ответ

Лучший ответ

Padding добавляет пространство между содержимым и рамкой, то есть делает серый тег больше.

Margin добавляет пространство между границей элемента и границей других элементов.

Если вы хотите добавить пространство между двумя элементами, вам нужно будет добавить маржу.

details {
    margin-bottom: 1rem;
    padding: .8em;
    background: #353535;
    border-radius: 20px
}
1
Sean Reilly 2 Май 2021 в 21:52