python (65.2k questions)

javascript (44.3k questions)

reactjs (22.7k questions)

java (20.8k questions)

c# (17.4k questions)

html (16.3k questions)

r (13.7k questions)

android (13k questions)

Questions - html-tag-summary

Add padding to <details> without decreasing width of <summary>

I'm trying to add left & right padding to the details text when the details block is open, without the padding the text runs right up to the edge of the background and looks crowded. However, when...
test-img

chad

css

padding

html-tag-details

html-tag-summary

Votes: 0

Answers: 2

Latest Answer

A quick solution would be wrapping the details text (those p elements) into a div element and apply the padding for that new div instead of the details element. summary.accordion-button { displa...
test-img

ThS

Details summary h4 hover color

I am trying to color the h4 text inside a details summary upon hover, but the color change only takes effect when hovering DIRECTLY OVER the actual h4 text, how can I modify my CSS to change the h4 te...
test-img

chad

css

css-selectors

hover

html-tag-details

html-tag-summary

Votes: 0

Answers: 1

Latest Answer

You need move :hover to the parent element: .accordion-button:not([open]):hover h4, .accordion-button:not([open]):focus h4 { color: var(--color-button-text); }
test-img

vanowm

Posts

Questions

Blogs

Jobs