Lightbox가 잘못된 HTML 구조(div가 p 안에 위치)를 생성하여 표시 오류 발생

기여 버그
,
1

Lightbox는 각 이미지에 대해 <div> 태그를 생성하지만, div 태그는 p 태그 내부에 배치될 수 없습니다(HTML 명세에서 <p>의 콘텐츠 모델은 phrasing content이며, 이에는 <div>가 포함되지 않습니다). 이로 인해 브라우저는 이러한 div가 p 태그를 닫고 밖으로 나가도록 처리합니다. 그 결과, 이후의 콘텐츠도 p 태그 외부로 나가 특정 환경에서 문제를 일으킬 수 있습니다. 예를 들어,

[details="details" open]
![random image|690x388](upload://2gkjgw9XkBQlTRrNCIxGZ96CLRC.png)
Some text *emphasized* or **bold** or @panic mention
[/details]
details

random image
random image3840×2160 124 KB

Some text emphasized or bold or @panic mention

은 다음과 같이 렌더링되어야 합니다.

Some text emphasized or bold or @panic mention

현재의 렌더링 결과인

图片
图片938×255 11.7 KB

과는 다릅니다.

현재의 동작은 <details>가 모든 직접 자식 요소를 블록으로 취급하기 때문입니다.

2개의 좋아요
2

이 내용을 좀 더 자세히 설명해 주실 수 있을까요? 어떤 환경에서 발생하는 문제인지 알려주시면 수정 작업을 우선순위에 반영하는 데 도움이 됩니다.

2개의 좋아요
3

위에서 보여준 <details> 태그처럼.