Search code examples
htmlcsshtml-tag-detailshtml-tag-summary

How do I get rid of the frameboard surrounding the <details> & <summary> tags?

If you click on the or a grey-blue frameboard appears surrounding the title. How do I edit CSS & HTML?

<style>
summary::-webkit-details-marker {
    display:none;
    color:transparent;
</style>

Visit https://jimmydance.com/belly-dance-history.html and have a look.

Thanks

Solution

  • You just need to use :

    summary {
    outline: none;
}

    Demo : https://jsfiddle.net/Paf_Sebastien/vdxft2o3/