0

I have some CSS for a Wordpress blog. I want paragraphs to indent, but blocks of code to align left to the margin. This is the code that I have---all of these elements appear with a <div class="postContent" tag, and Wordpress automatically wraps post text blocks in <p> tags.

First, I've set all paragraphs within the div tags to indent:

.postContent p { font-size: 1.2em; text-indent: 2.5em; text-align: justify; line-height: 1.6em; margin: 1em; }

Then, Wordpress sets aside the first paragraph as a .lead paragraph. I want that to indent, provided it's not code:

.postContent p.lead code { margin: 0; text-indent: 0; }

That works just fine. However, all the other code paragraphs are still indenting, so I added this to the stylesheet:

.postContent p code { text-indent: 0; padding: 0; padding-top: 2em; padding-bottom: 2em; }

No dice. The code blocks are still indenting according to the .postContent p rule.

4

2 に答える 2

1

要素内の要素を設定text-indentしても、要素のインデントには影響しません。ブロックコンテナのみに適用されるため、実際には何にも影響しません。codepptext-indent

に のみが含ま<p><code>...</code></p>れるようにマークアップされている場合は、追加できますpcode

.postContent p code { display: block; }

次に、垂直方向の間隔をどうするかを検討します。これは、追加後に少し過剰になる可能性があります (つまり、 の余白と のpパディングcode)。

于 2012-11-03T07:47:39.673 に答える
1

html のソースと実際の css コードの両方を見ずに言うのは本当に難しいですが、あなたのスタイルはより具体的なスタイルによって上書きされていると思います。

最善の方法は、Firebug を Firefox にインストールして (実際には、ブラウザーに最適な開発ツールです)、対象となる要素を調べることです。インスペクターは、要素に適用されているすべてのスタイルを表示する必要があります。オーバーライドされたスタイルには取り消し線が付きます。それらがオーバーライドされている場合は、スタイルをより具体的にしてください。それ以外の場合、リストにスタイルが表示されない場合は、それを正しくターゲットにしていません。

それが役立つことを願っています。幸運を。

于 2012-11-03T00:29:29.303 に答える