2016-09-28 9 views
1

Meine WordPress-Seite überspringt eine CSS-Klasse, und es zeigt sich nicht gut. Es hat keine Polsterung.Wordpress Seite nicht lesen CSS richtig

In meinem Wordpress-Thema haben alle Seiten die .page.thentry-Klasse in ihrem Klassenattribut.

Die Seite "Fragen" hat diesen HTML Code:

<article id="post-70" class="post-70 page type-page status-publish hentry">... 

Und funktioniert ok, aber meine Fragen Seite nicht

<article id="post-69" class="post-69 page type-page status-publish hentry">... 

Wenn ich den Code mit Chrom zu sehen, der Gegenstand Nur die .hentry-Klasse.

Dies ist Teil des CSS-Code:

.hentry { 
    margin: 0 0 45px; 
    background-color: #fff; 
    border: 1px solid #e0e0e0; 
} 
.page .hentry { 
    padding: 45px; 
} 

Dies ist der Link zur page with the problem und the other page

Antwort

1

.page .hentry bedeutet, dass es Elemente mit Klasse adresses hentryinnen ein Eltern/Groß usw. Element mit Klasse .page

Blick auf die Klassen in der body Tag: Die eine Seite hat Klasse page im Körper, die andere archive (und keine page) So der .page .hentry Selektor gilt nur für .hentry in der Seite, die .page in seinem body Tag hat, nicht die archive Seite.

wenn Sie beide ansprechen wollen, können Sie .page.hentry als Selektor (ohne Leerzeichen dazwischen) verwenden - dies für alle Elemente, die sowohl .page UND .hentry Klassen gelten.

+0

That hat perfekt funktioniert, danke. – Juanky

0

Zuerst müssen wir eine jsfiddle/ähnliche Schnipsel Sie Ihre Probleme lösen helfen.

Aber mein Tipp ist, gehen Sie zu Ihrem Thema Ordner (innerhalb Inhalt/yourthemename) und prüfen mit einigen Code-Editor wie ATOM oder SUBLIME und suchen Sie nach, wo die Frage Seite generiert wird.

1

Die Seite, die funktioniert, hat .page auf der Body-Klasse, aber die, die nicht diese Klasse aus dem Körper fehlt.

Der Wähler ist:

.page .hentry { 
    padding: 45px; 
} 

aber wenn .page wird es nicht vorhanden ist überspringen.

Lösung, sie verwenden beide #main so die CSS ändern:

#main .hentry { 
    padding: 45px; 
} 

oder einfach nur die Polsterung in der:

.hentry { 
    padding: 45px; 
    margin: 0 0 45px; 
    background-color: #fff; 
    border: 1px solid #e0e0e0; 
} 

Hier ist eine weitere Alternative:

.page.hentry { 
    padding: 45px; 
} 
+0

Das Problem dabei ist, dass andere Seiten #main und .hentry verwenden, so dass ich sie nicht ändern kann. Ich habe versucht, die .page-Klasse mit jquery zum Körper hinzuzufügen, aber es hat nicht funktioniert. – Juanky

+0

dann verwenden .page.thentry {} tun andere Seiten verwenden, dass sie zusammengefügt werden müssen, was bedeutet, beide .page & .hentry sind auf das Artikelelement angewendet –

+0

Ich konnte es beheben, danke. – Juanky