はてなブログでの CSS 編集につきまして。p タグに隣接する blockquote だけに設定を反映させたいのですが、うまくいきません。何かお気づきになる誤りがあれば、ご指摘いただけないでしょうか?


div.entry-content p + div.entry-content blockquote {
margin-top: -20px;
margin-bottom: 60px;
}

p + div.entry-content blockquote でも設定が反映されませんでした。div.entry-content blockquote のみであれば設定が反映されていることを確認しております。

回答の条件
  • 1人1回まで
  • 13歳以上
  • 登録:2016/01/02 10:25:13
  • 終了:2016/01/02 11:08:10

ベストアンサー

id:a-kuma3 No.1

a-kuma3回答回数4363ベストアンサー獲得回数18002016/01/02 11:03:54

ポイント400pt

こんな感じで。

div.entry-content p + blockquote {
    ...
}
他1件のコメントを見る
id:a-kuma3

子孫セレクタの「空白」と隣接セレクタの前後に付けられる空白の優先順位が分かりにくいんだと思います。

質問のセレクタは、結合の優先順位を括弧で強調してみる(CSS の記法ではありません)と、こういう意図だと思いますが、

( div.entry-content p ) + ( div.entry-content blockquote ) {

多分、左から解釈されて、以下のようになっているのではないか、と思います。

( ( div.entry-content p ) + div.entry-content ) blockquote {

もしくは、隣接セレクタが子孫セレクタよりも結合の優先順位が高いのであれば、こうとか。

div.entry-content ( p + div.entry-content ) blockquote {


隣接セレクタや兄弟セレクタは、左側の指定と同じ階層にあることは確定しているので、

( div.entry-content p ) + blockquote {

「div.entry-content 配下の p に隣接する blockquote」か、

div.entry-content ( p + blockquote ) {

「p に隣接している blockquote の内、div.entry-content の配下にあるもの」というような解釈をしてくれるんだと思います。

2016/01/02 13:36:56
id:domodomodomo

理屈わからないけど調べとる時間がないと、
急いていたところでございます。
ご教示いただき、誠にありがとうございます (´;ω;`)ブワッ

2016/01/02 20:22:02

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません