Tumblrのテキスト投稿でtableタグが使えない

Tumblrのテキスト投稿でtableタグを使うと、内容がpタグに入った状態で出力されてしまいました。
タグの制限とかがあるのかと思い試してみると、いくつか使えないタグがあるようだったので今後のためにメモ。

使用できないタグ

試してみた中で割と不便そうなところでは、table・dlタグの使用ができませんでした。
div・p・hX・ul・olタグなんかは問題なく出力されるようです。

HTML5のタグは試してみたのはほぼ駄目でした。
出力できたのはarticleタグだけで、一緒に試したheader・footer・section・nav・figure・timeタグは
使用できませんでした。

CSS関連

インラインCSSの記述が不可みたいです。
id/classの付与は問題ないみたいなので、外部ファイルでCSSを用意しておいて、id/classを使って
CSSを付与するというやり方しかできなさそうです。
 

使用できないタグを使っていた場合は、含まれているテキストがpタグに入った状態で出力されるようです。
その際、付与しているid/classは削除されてしまいます。

対応策

対応策というほどでもないですが、tableの表組ができないのは少し困るので
今回はdivで疑似的なtableを作って対応しました。

HTML

<div class="table">
	<div class="tr">
		<div class="th">項目名</div>
		<div class="td">内容テキスト</div>
	</div>
	<div class="tr">
		<div class="th">項目名</div>
		<div class="td">内容テキスト</div>
	</div>
</div>

CSS

.table {
	display: table;
}
.table .tr {
	display: table-row;
}
.table .tr .th {
	display: table-cell;
}
.table .tr .td {
	display: table-cell;
}

どうしてもtableタグでないと駄目という場合、出力後にJavaScriptでタグを置き換えるという手も
なくはないと思います。
そこまでしてtableタグでないといけない場面があるのかは分かりませんが。

このエントリーをはてなブックマークに追加

関連記事

コメントを残す

メールアドレスが公開されることはありません。
* が付いている欄は必須項目です

CAPTCHA


コメントが承認されるまで時間がかかります。

2024年11月
 12
3456789
10111213141516
17181920212223
24252627282930