From bac7aefb6dc44a7784ad62e2187af3b5422ba9bd Mon Sep 17 00:00:00 2001
From: Alexander Ebert <ebert@woltlab.com>
Date: Fri, 23 Dec 2016 11:40:00 +0100
Subject: [PATCH] Using spans instead of `<figure*>`

`<figure>` and `<figcaption>` are better in terms of semantics, but
heavily limit the abiliy to nest them into other elements, as they're
block-elements themselves.

This is especially the case when used as inline images, because browsers
will pop them out of the flow.
---
 com.woltlab.wcf/templates/mediaBBCodeTag.tpl   | 6 +++---
 wcfsetup/install/files/style/bbcode/media.scss | 3 ++-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/com.woltlab.wcf/templates/mediaBBCodeTag.tpl b/com.woltlab.wcf/templates/mediaBBCodeTag.tpl
index b4f206b367..a988ab095c 100644
--- a/com.woltlab.wcf/templates/mediaBBCodeTag.tpl
+++ b/com.woltlab.wcf/templates/mediaBBCodeTag.tpl
@@ -1,4 +1,4 @@
-<figure class="mediaBBCode{if $float != 'none'} messageFloatObject{$float|ucfirst}{/if}">
+<span class="mediaBBCode{if $float != 'none'} messageFloatObject{$float|ucfirst}{/if}">
 	{if $thumbnailSize != 'original'}
 		<a href="{$media->getLink()}" class="embeddedAttachmentLink jsImageViewer"><img src="{$media->getThumbnailLink($thumbnailSize)}" alt="{$media->altText}" title="{$media->title}"></a>
 	{else}
@@ -6,6 +6,6 @@
 	{/if}
 		
 	{if $media->caption}
-		<figcaption>{$media->caption}</figcaption>
+		<span class="mediaBBCodeCaption">{$media->caption}</span>
 	{/if}
-</figure>
+</span>
diff --git a/wcfsetup/install/files/style/bbcode/media.scss b/wcfsetup/install/files/style/bbcode/media.scss
index b8613ae1d6..11aaccabe7 100644
--- a/wcfsetup/install/files/style/bbcode/media.scss
+++ b/wcfsetup/install/files/style/bbcode/media.scss
@@ -1,8 +1,9 @@
 .mediaBBCode {
 	display: inline-block;
 	
-	figcaption {
+	.mediaBBCodeCaption {
 		color: $wcfContentDimmedText;
+		display: block;
 		margin-top: 5px;
 		text-align: center;
 		
-- 
2.20.1