コンテンツにスキップ

英文维基 | 中文维基 | 日文维基 | 草榴社区

Wikipedia:井戸端/subj/モバイル版でのdl・dt・ddの字下げについて

モバイル版でのdl・dt・ddの字下げについて

[編集]

デスクトップ版とモバイル版での表示の違いについてはH:MOBILEなども含め既に多くの議論がされているようですが、新たにお知恵を借りたく書き込みます。以前に「Wikipedia:井戸端/subj/モバイルビューでの表示について」を読み、モバイル版でも;:を用いた定義リストでも字下げがされるように個人cssを設定していたのですが、昨晩頃から先述の議論で紹介されているcss設定が機能しなくなっているようです。色々と自分なりに手立てがないか調べて試してみた結果、

dl { 
	margin-left: 0;
}
dd { 
     border-left: 15px solid #00000000; 
}

と記述することで一応落ち着きましたが、これは「:(dd)要素の前に太さ15pxの透明なボーダーを置くことで、字下げされているように見せる」という処理のため、デスクトップ版で閲覧した場合には必要以上に:が下がっているように見えてしまいます。「Wikipedia:井戸端/subj/モバイルビューでの表示について」で紹介されていた方法では、デスクトップ版で閲覧した際の表示に影響はなくモバイル版での閲覧のみ改善されていて勝手が良かっため、今回も他に何か上手い方法があれば……と思っているところです。モバイル版で;:のインデントが揃ってしまうことはもう仕様なのだろうと諦めていますが、何かcssの設定など案をお持ちの方がいれば伺いたいです。--雪舟会話2024年2月20日 (火) 01:10 (UTC)[返信]

こちらでどうでしょうか。
dl {
    margin-left: 0;
}
dl dd {
    margin-left: 1.6em;
}
--t=mozo会話2024年2月20日 (火) 01:59 (UTC)[返信]
感謝 早速のご回答、ありがとうございます。ご提示いただいた記述を個人cssに設定したところ、デスクトップ・モバイル共に求めていたものにかなり近い表示になりました。昨晩から色々と苦戦していたので助かりました、重ねてお礼申し上げます。--雪舟会話2024年2月20日 (火) 02:27 (UTC)[返信]