Question
JIN:Rでのアプリーチでレイアウトがおかしい
- S S A
-
前回の回答で一時的に解決しましたが、また表示がズレています
対策をお願いいたします。
現状は前回教えていただいた追加CSSを入れている状態です。
前回の回答↓
https://jinr-forum.jp/jinr-question/jinr%E3%81%A7%E3%81%AE%E3%82%A2%E3%83%97%E3%83%AA%E3%83%BC%E3%83%81%E3%81%A7%E3%83%AC%E3%82%A4%E3%82%A2%E3%82%A6%E3%83%88%E3%81%8C%E5%B4%A9%E3%82%8C%E3%82%8B/
- WP 6.1系
- PHP 8.1
- JIN:R 1.0.5
- Xserver
- GoogleChrome
- Windows10
-
こんにちは!
2023/02/08 22:09JIN:R運営チームのtsu_です。
前回の回答のリンクありがとうございます。
"前回の回答で一時的に解決しましたが、また表示がズレています"
との事なのですが、全ての記事で表示がズレてしまっている状態でしょうか??
前回ご相談いただいた時と崩れ方が同じに見えるので、
修正用のCSSが上手く適用されていないのかもしれません。。
お手数おかけしますが、実際の記事の URL をご共有いただけますか??
ご確認よろしくお願いいたします!
こちらになります。
2023/02/09 10:47よろしくお願いいたします。
https://nft-start.net/2023/02/09/%e3%83%86%e3%82%b9%e3%83%88/
URLありがとうございます!
2023/02/09 13:35原因が2点ありそうなのですが、、、
まずは追加 CSS に書いていただいてる
「// ここからコピペ」
「// ここまで」
を削除してみていただけますか??
もう1点は出力されているアプリーチのコードに空のpタグが入っているようで、
これの影響で表示がズレてしまっているみたいです。。。
貼り付けているコードを調べられそうでしたら、影響している空のpタグを削除していただいて、
よく分からなそうでしたら、いま追加 CSS の最初の方に書いてある
#postContent .appreach__detail p {
margin: 0;
}
を
#postContent .appreach p {
margin: 0;
}
に変更して変化があるかご確認いただきたいです。
お手数おかけしますが、よろしくお願いいたします!
完全に直りました。
ありがとうございます!
恒久的な対策もよろしくお願いいたします。
以下、追加CSSに貼り付けたコードになります。
#postContent .appreach p {
margin: 0;
}
.appreach .appreach__links {
display: flex;
height: 28px;
}
@media (max-width: 767px){
.appreach__links .appreach__gplink img {
width: 97px;
height: 28px;
}
.appreach__links .appreach__aslink img {
margin-right: 5px;
width: 97px;
height: auto;
}
.appreach .appreach__links{
margin-top:4px;
}
#postContent .appreach__info {
font-size: 10px !important;
}
#postContent p.appreach__name {
font-size: 14px;
}
.appreach__links a {
height: 28px;
}

2023/02/10 16:14