Stack Overflow
Stack Overflow

Questions tagged [html-tag-details]

Use this tag for question about HTML5

tag.

The <details> tag is one of the HTML5 elements. It creates a disclosure widget and contains additional details, that the user can open and view. By default, the content of the tag is not displayed. In order to display the contents, you must apply the open attribute. A disclosure widget is commonly presented with a small triangle that twists (or rotates) to show open/closed state.

It is often used with <summary> tag.

63 questions
1
vote
1 answer

HTML5 details element and VoiceOver

I am currently using the details/summary element in my JSP. When I turn on VoiceOver to test accessibility, VoiceOver simply stops when it reaches the details element. It sounds like it doesn’t know what to do with it. Any idea if there is a…
user1366265
  • 1,306
  • 1
  • 17
  • 28
1
vote
3 answers

once again div vs tables

In my project, I have come across a situation where we have to create table (expandable). I have implemented using divs and spans. my senior is asking ti implement it using td,tr
Navaneeth
  • 2,555
  • 1
  • 18
  • 38
1
vote
2 answers

Are pictures inside a
tag loaded before or after you "open" the details?

Pretty much as the title says, if I put an image inside a details tag will I save bandwidth for the user, so it won't load until they open it?
user938773
  • 13
  • 3
0
votes
2 answers

Is it possible to style HTML's details tag like this?

This is what I am trying to achieve, > Variable Length Title: A sentence worth of text that may or may not wrap depending upon the width of the container. This…
scribe
  • 673
  • 2
  • 6
  • 17
0
votes
2 answers

I am trying to align text and image right next to each other horizontally but the part the image always gets out of span

I am trying to put image at right of the text but it always get cropped out of the container html/css is: body { background-color: #1e4bdd; background: linear-gradient(105deg, #f2eeee, #0808d4); } .container { text-align: justify; …
Uzumaki
  • 27
  • 4
0
votes
0 answers

details HTML element in Angular appears to be working backwards, with 'open' absent, details.open gives true

I am having a terrible time trying to capture the state of a
element in Angular 16. The best I have got so far after using the good ol chat AI and lots of Stackoverflow was do do this in the html
Brian Reinhold
  • 2,313
  • 3
  • 27
  • 46
0
votes
1 answer

Multi-line details summary forces summary::marker above text

I'm using details to make content sections collapsible. I've set the summary h3 to be display: inline-block; so the marker is in line with the header. Unfortunately, when the title wraps to multiple lines, the marker jumps to above the header. How…
Chris
  • 11,819
  • 19
  • 91
  • 145
0
votes
0 answers

Unwanted padding between details and summary element

I have the following structure: details { padding: 1px; background: yellow; } details summary > * { display: inline; } summary { height: 50px; list-style-type: none; } summary img { height: 25px; }
Tobias Wohlfarth
  • 56
  • 7
0
votes
1 answer

Can I apply Bootstrap's Accordion or Alert styles to HTML
and ?

My projects use Bootstrap and most of the time without any Javascript because I only need the styling. Now I have a project that needs something like their Accordion which needs Javascript to work. However there is a standard
HTML tag that…
Luke Vo
  • 17,859
  • 21
  • 105
  • 181
0
votes
2 answers

Why CSS open event of summary tag not perform?

I am trying to make tag style more comfortable, and the opacity changage does not work, when I open the tag. Here is my code: details:not([open]) > :not(summary){ opacity: 0; -webkit-transition-duration:…
Han Han
  • 328
  • 12
0
votes
0 answers

Inside HTML alt attribute I want to show copyright symbol as a Superscript

I have an image and on an alt attribute. I want to show copyright symbol a Superscript. flwer© Logos currently it is showing like "flwer© Logos"
user1872177
  • 91
  • 8
0
votes
1 answer

Is there any way to effectively manage a large number of tags through JavaScript? (Animation is added as the
tag is opened and closed)

I want to put a blinking animation in the details tag, stop the animation when the tag is opened, and blink again when the tag is closed. A structure in which a detail tag is contained within a detail tag, and the number of detail tags is expected…
Son-Bin-O
  • 3
  • 2
0
votes
0 answers

Can't retract the needed tag while web scraping a site

What I am trying to do is make a code that converts RUB into PLN using exchange rates of 2 banks, the first one of which is here: https://qiwi.com/payment/exchange I'm trying to get the selling rate of yuans. What so ever, tags that I extracted…
AleksyStrzecki
  • 1
  • 2
0
votes
1 answer

Is it possible to have two different looks for details>summary tag in one document

I would like to have two different looks for details>summary tag in one document. The first one should look like this: It is done through CSS style and the code looks like this: