質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Markdown

Markdownは、文書の構造、修飾情報を記述するための軽量マークアップ言語です。

teratail

teratail(テラテイル)は、プログラミングに特化した日本語Q&Aサイトです。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

2回答

1929閲覧

2015/12/03以降、teratail で過去の質問/回答本文のレイアウトが崩れる(CSS起因?)

think49

総合スコア18156

Markdown

Markdownは、文書の構造、修飾情報を記述するための軽量マークアップ言語です。

teratail

teratail(テラテイル)は、プログラミングに特化した日本語Q&Aサイトです。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

9グッド

1クリップ

投稿2015/12/03 14:05

編集2015/12/03 22:51

teratailの質問/回答の本文で次のmarkdown書式を入力します。

- [質問投稿画面|teratail(テラテイル)](https://teratail.com/questions/input)

すると、次のようにマークアップされるようになりました。

HTML

1<ul> 2 <li><a href="https://teratail.com/questions/input">質問投稿画面|teratail(テラテイル)</a></li> 3</ul>

2015/12/02までは最も階層の深いmarkdown書式しか有効ではありませんでしたが、2015/12/03からはmarkdownの入れ子が認識されるように修正されています。
これは以前から切望していた機能でとても有難いアップデートです。

ところが、この修正後、過去に私が投稿した回答/質問欄でレイアウト上で崩れてしまっています。
HTML/CSSは次のようになっています。

CSS

1/** 2 * @url https://teratail.com/css/questions/markdown.css?1449116868 3 */ 4.question-preview a[rel="nofollow"] { 5 display: block; 6}

HTML

1-&nbsp;<a href="https://teratail.com/questions/input" rel="nofollow" target="_blank" class="question-preview">質問投稿画面|teratail(テラテイル)</a>

.question-preview a[rel="nofollow"] { display: block; } は2015/12/02までは存在しませんでした。
その為、以前はインライン要素のように使えていたa要素がブロックボックス扱いとなり、レイアウト上で互換性が保てなくなっています。
この現象は次の質問スレで確認できます。

この現象は皆さんの環境でも確認できるでしょうか。
また、他にアップデートに伴う不具合があれば、教えて下さい。


(2015/12/04 00:20追記)

公式ブログで報告しました。


(2015/12/04 00:47追記)

コードブロックのCSS周りもおかしいですね。
私の回答は再編集したので期待通りに表示されますが、2015/12/02以前に投稿した他の方の回答のスタイルが崩れているように見えます。

Lhankor_Mhy, hpfoon, izkn, hirai0110, pi-chan, 5o5o_wagon, sho_cs, argius, katoy👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

ベストアンサー

think49様

いつもご利用ありがとうございます。teratail開発チームです。

表示の不具合をご指摘いただきありがとうございます。
先ほどコードブロックのデザイン崩れを修正させていただきました。
他の質問についても、正しくブロックが表示されるようになっているかと思います。

Markdownがより使いやすくなるように、今回大きく修正を入れさせていただきました。
しばらくは入力の際の感覚が変わるかと思いますが、
新しい記法についてはヘルプを参照しながら理解していただければ幸いです。

また気になること等ありましたらお気軽にお問い合わせ等からご連絡ください。
今後ともteratailをよろしくお願いいたします。

投稿2015/12/04 04:48

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

think49

2015/12/04 14:37 編集

私が確認する範囲では全て修正されている事を確認しました。 迅速な対応ありがとうございました。
guest

0

過去のすべての投稿の見栄えを変えてしまうことになるので、一度HTMLに変換されたものは固定されているのだと思います。

たとえば、新しい機能では、改行がBRタグに変換されなくなっていて、旧来の入力では改行が無くなってしまってかなり見づらくなることが予想されます。
気になるところは再編集で対応するのが良いんじゃないでしょうか。


参考リンク:

Markdown記法を変更しました|teratailブログ
https://teratail.com/blog/article/ba21

投稿2015/12/03 14:34

argius

総合スコア9388

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

think49

2015/12/03 14:58 編集

公式ブログには「基本的に既に投稿されている質問や回答については見た目の変化はありません」とありますが、過去の投稿ではa要素に "display: block;" が適用されていなかったのにも関わらず、現時点では ”display: block;” が適用されています。 HTMLは変わっていませんが、CSSが変わっているようです。 過去と現在で表示に違いが出てしまっているのですが、過去の全ての投稿を再編集しなくてはならないのでしょうか。
argius

2015/12/03 14:58

明らかにレイアウトが崩れているのは困りますね。 その辺は回答者のみなさんが苦労するのはおかしいと思うので、いくつかサンプルを挙げて、運営に相談してみるのが良いのではないでしょうか。 私も自分の回答で明らかにレイアウトが崩れて見苦しいところがあったら、ここに書いておくようにします。
think49

2015/12/03 15:22 編集

やや分かりづらい説明だった為、質問文を修正しました。 また、お勧めに従い、公式ブログでも報告しました。
argius

2015/12/04 02:39

なるほど、明らかに崩れている投稿もけっこうありますね。 私自身の回答は2ヶ月ほど遡ってみましたが、特にレイアウトが乱れているものはありませんでした。
think49

2015/12/04 14:38

おかげさまで運営に報告し、修正に至りました。いろいろとアドバイスありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問