お世話になっております、表題の件、
非常に低レベルな質問になるかと思いますが
失礼致します。
現在、ワードプレスのtwentyelevenをカスタマイズし、
ホームページを作成しておりますが
sidebar.phpを編集してCSSを効かせようとしているのですが
paddingやmarginなどが反映されず困っております。
#secondaryという<div>の中にある
<p>にpaddingをかけようとしており、
サイドバーの中のリンクを右に寄せて
リンクの色を黒に統一しようとしており、
リンクの色は黒に変更したのですが、
paddingが効きません。
※コード
#secondary .sidebar_font (padding-left:20px;}
.sidebar_font a:link { color: #000; }
.sidebar_font a:visited { color: #000; }
.sidebar_font a:hover { color: #000; }
.sidebar_font a:active { color: #000; }
#secondaryのスタイルによってpaddingやmarginが効かなくなることがあるのでしょうか?
大変恐縮ですが
ご助力戴ければ幸いでございます。
No.1ベストアンサー
- 回答日時:
通常、親のスタイルは子のスタイルによって上書きされます。
padding の { が ( になってますが、タイプミスですよね?
手元で実験してみましたが、適応されました。(IE,FireFox,Chrome)
レンダリングした際のpタグの位置など、細かい状況をお聞かせいただければと思います。
No.2
- 回答日時:
現在ウェブ標準のCSSでは、基点となるセレクタに続いてセレクタを記述していきます。
>#secondaryという<div>の中にある<p>にpaddingをかけようとしており、
ということは、*(全称セレクタ)が省略された書き方ですから
*#section *.sidebar_font a{}
が本来の形です。*全称セレクタの詳細度は0ですから計算すると
1,1,1になりますね。
もし、このセレクタが無効になるとしたら、他の箇所でより詳細度が高い、もしくは詳細度が同じでも後出の宣言で上書きされている可能性があります。
現在のDOMツリーがわかりませんから、具体的なアドバイスは不可能ですが、より詳細度を高くした書き方で指定すると良いでしょう。
firefoxの場合、ツールにDOM Inspectorが標準インストールすると入っていますので、それでDOMツリーを確認してください。
ID class
BODY
DIV section
P sidebar_font
のように表示されるはずです。航であれば、それにしたがって
body div#section p.sidebar_font a{} 詳細度 0,1,1,4
とか
また、firefoxのアドオンにfireBugというすばらしいアドオンがあります。該当する要素をに対するスタイルシートの継承や上書きがわかります。
なお、paddingは、継承されないプロパティですから親要素で指定しても子孫には継承されません。colorは継承されますが、marginやpaddingは継承されないなど、どのプロパティが継承されされないかは常識の範囲内ですが、知りたいときはそれぞれの指定を確認してください。
Inherited: no ( http://www.w3.org/TR/CSS2/box.html#propdef-paddi … )と書かれていれば継承しません。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- オープンソース cssで中央寄せ 1 2023/05/19 06:25
- HTML・CSS CSSがなぜかfont-sizeだけ効かない...記述がまちがっているんでしょうか 5 2022/04/09 17:52
- HTML・CSS アコーディオンメニューが思うように動作しません。 1 2023/08/20 16:48
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS テキストを画面の真ん中に配置したいです。 2 2022/11/25 16:11
- HTML・CSS HTML & CSS 縦ボックス内の文字の左右センタリング 3 2023/03/25 04:23
- HTML・CSS cssの display: flex;で横並びにならずに困ってます 1 2022/12/04 13:18
- HTML・CSS htmltとcssのコードで 1 2022/11/26 13:37
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
liリストタグの背景色に色がつ...
-
個別にリンクの色を変える方法
-
一部のリンクの下線を消す
-
サイトにjQueryが使用されてい...
-
CSSでid名やclass名に「_」や「...
-
最近、HTMLのヘッダーをIDで定...
-
外部css定義したclassをht...
-
idの中のid指定
-
ページの左右の余白(枠外)に...
-
<span>で2重にかけているものを...
-
webサイト印刷時に特定の画像を...
-
リンク文字の 一部だけ色を変...
-
印刷曜CSSがどこかおかしい・・...
-
FC2掲示板をトピック一覧表示型...
-
htmlの文字が縦書きになる
-
「諸要素」とはどういう意味で...
-
中点「・」の改行について
-
番号付きリスト(<Ol><Li>・・...
-
画像の横に文字をうまく配置で...
-
htmlのolやulなどlistにtitleや...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
個別にリンクの色を変える方法
-
htmlのid属性って必要なの?
-
最近、HTMLのヘッダーをIDで定...
-
HTML要素のid/class名の長さに...
-
CSSに同じclass名がいっぱい‥。...
-
liリストタグの背景色に色がつ...
-
CSSのクラス名・ID名の指定でワ...
-
サイトにjQueryが使用されてい...
-
ページの左右の余白(枠外)に...
-
CSS, リンクの色を一部変えるに...
-
透過背景を解除するにはどうす...
-
<span>で2重にかけているものを...
-
idの中のid指定
-
display:table-cell内でこんな...
-
CSSが効かずどのように指定すれ...
-
スタイルシートで、id属性の中...
-
【VBA/HTML】IE画面内のページT...
-
brにクラスをつけてcssでdispla...
-
外部css定義したclassをht...
-
CSS内で使われる山括弧の意味が...
おすすめ情報