Beiträge von SEpp55

Zitat

Titel ist aber noch nicht ganz in der Mitte.

Versuche das

#primary .entry-header,
 #primary .page-header {
        width: 100% !important;
        text-align: center;
    }

Also mit !important.

Zitat

Wie kann man sich eigentlich im CSS Notizen machen, ohne dass das die Programmierung beeinflusst?

Im Zusätzlichen CSS sieht man das - z.B.

/* Füge deinen eigenen CSS-Code nach diesem Kommentar hinter dem abschließenden Schrägstrich ein. 
Klicke auf das Hilfe-Symbol oben, um mehr zu erfahren.
*/

Das ist ein Kommentar ;-)

Zitat

Wie machst Du das eigentlich immer, wenn Du hier im Forum die CSS-Codes eingibst, dass das so wie ein Screenshot aussieht?

Da gibts bei Annwort unten in der Leiste Antworten, Erweitert, und Abbrechen. Mit Erweitert gibts eine erweiterte Symbolleiste die erweiterte Möglichkeiten anbietet ;-)

Das mit dem Mouse-over-Effect wird mit "grayscale" gemacht! da hatten wir erst im letztn Monat etwas im Forum - finde es aber momentan nicht ;-)

Ich sehe nur ein eine "primary-navigation" - kein Breadcrumb - Menü!

Doch noch gefunden - LINK1 und LINK2

Ggf mußt du noch an den Randeinstellungen bei Column Shortcodes schrauben. Du hast rechts 100px Rand eingestellt -

Die Schriftart und -größe verwende ich das Plugin WP-Edit, da kannst du verschiedene Einstellmöglichkeiten auswählen!

Den Titel zentrieren:

#post-97 .entry-title {
    padding-left: 20%;
}

entfernen!

Neu einfügen;

#primary .entry-header,
 #primary .page-header {
        width: 100%;
        text-align: center;
    }

Hast du das mit der Spaltenbreite versucht?? Der Teil wäre ja nur zum Einfügen in die zusätzlichen CSS, wie in #2 angeführt.
Ergebnis sollte sofort zu sehen sein!
Das ist ja zum Testen einmal unabhängig von der Überschrift - nicht ganz ;-)
Aber wenn du jetzt mühevoll die Überschrift positionierst und danach die Spalten breiter machen möchtest wird die Überschrift nicht ganz dazupassen.

Wenn du die Spalten breiter haben möchtest kannst du das obere wieder schmeissen ;-)

#post-97 .entry-title {
    padding-left: 40%;
}

Die max-Breite erreichst du mit:

#post-97 #primary .page-content,
body.page-two-column:not(.archive) #primary .entry-content,
body.page-two-column #comments {
width: 100%;
}

Sophie hat die richtige Spur angezeigt! :idea:

Ich habe zu Testzwecken im Entwicklermodus von Firefox (F12) in der Themen style.css die Zeilen 1362 - 1375 und 2787 - 2794 (first-letter) deaktiviert.

/* Drop cap and first line 
.format-standard:not(.post-password-required) .entry-content > p:not(.no-emphasis):first-of-type:first-letter,
.page:not(.post-password-required) .entry-content > p:not(.no-emphasis):first-of-type:first-letter,
.emphasis:first-letter {
  color: #b7b1a9;
  display: inline-block;
  float: left;
  font-family: "Playfair Display";
  font-size: 70px;
  font-style: normal;
  font-weight: 700;
  line-height: 40px;
  margin: 6px 10px 0 -5px;
}
*/


  /* Use a bigger drop cap
  .format-standard:not(.post-password-required) .entry-content > p:not(.no-emphasis):first-of-type:first-letter,
  .page:not(.post-password-required) .entry-content > p:not(.no-emphasis):first-of-type:first-letter,
  .emphasis:first-letter {
    font-size: 121px;
    line-height: 70px;
    margin: 6px 10px 0 -5px;
  }
 */

Ggf in Zeile 1381 (first-line) noch die font-family: auf "inherit" setzen.

Thats it ;-)

Über die Zusätzlichen CSS hatte ich mit "inherit" (= erben) anstatt der Werte den selben Erfolg!

Die Style-Anpassungen werden unter Design - Customizer - Zusätzliche CSS gemacht werden! LINK.

Für größere Anpassungen wird ein Child-Theme empfohlen!

Schau mal im Entwicklermodus, wenn du den Hacken bei "border-radius" löcht und wieder setzt!
Das heißt ...... wenn transparent, dann Hintergrund = dunkelgrau - #2E3037!!

Stelle mal die width und height auf 170px und vergiss das opacity in diesm Falle.

.focus-box .service-icon {
    width: 170px;
    height: 170px;

Zitat

mit dem PC kann man erkennen, dass das Runde Emblem relative weit oben, nicht in der Mitte des Photos/Bildschirmes sitzt

Wenn amn sich dein Bild ansieht kann man erkennen, daß dein Logo NICHT mittig im Bild ist!!

Somit zeigt die Seite das Bild offensichtlich wie es eingestellt wurde ;-)

Zitat

Weiß jemand wie das funktioniert?

- Ja, das wissen einige ;-)

Zu deiner eher allgemeinen Frage eine allgemeine Antwort - LINK Hilfe zur Selbsthilfe!
Sonst einmal das lesen besonders (II) und danach die Frage ggf. mit entsprechenden Daten ergänzen.

Die Hilfe zur Selbsthilfe - Hintergrundbild durchscheint - in die Suchmaschine deines Vertrauens ergibt! LINK!

Wobei das verwendete Theme Twenty Seventeen

aber schon responsive ist!!

Also

Zitat

auch auf Mibilen geräten

vernünftig zu sehen sein sollte ;-)

Für solche Änderungen mein Kopiersatz!
Die Style-Anpassungen werden unter Design - Customizer - Zusätzliche CSS gemacht werden! LINK.

.entry-header, .title-block {
    border-bottom: 0;
}

Letzter Tip von mir - LINK1 - LINK2.

Aber was steht da????

Zitat

[h=1][size=12]How to add static color for our focus section in Zerif
[/SIZE][/h]

Da steht nichts von hovern!!

Statt deiner "Farbe Kreis um Sportangebot" verbasteilei füge folgendes in die Zusätzlichen CSS ein:

.focus-box .service-icon {
    border: 10px solid #da4453;
}


#focus span:nth-child(4n+1) .focus-box .service-icon:hover {
 border: 10px solid #494949 !important;
}
#focus span:nth-child(4n+2) .focus-box .service-icon:hover {
 border: 10px solid #494949 !important; 
}
#focus span:nth-child(4n+3) .focus-box .service-icon:hover {
 border: 10px solid #494949 !important; 
}
#focus span:nth-child(4n+4) .focus-box .service-icon:hover {
 border: 10px solid #494949 !important;
}

Offensichtlich willst du im Theme eine Änderung vornehmen, die NICHT so durchgeführt wird wie WordPress es vorsieht!

Wenn du in der style.css eine Anpassung vornehmen willst - den Text lesen und verstehen!
Wenn du in einer xxx.php eine Änderung machen willst - Child Theme anlegen!

Warum das Ganze - bei einem Themenupdate wird sonst deine Änderung wieder überschrieben..... :-(

Und Herr Go..le weiß auch viel dazu ;-)

Für das zweite Problem:

Die Frage warum das so ist kann ich nicht beantworten, da ich Ninja Forms noch nicht verwendet habe.
Vielleicht hilft das weiter LINK - Video. Ggf den hacken bei "Show Help Text" entfernen??
Aber zur Problemlösung habe ich mit Firefox und dem integriertem Entwicklertool (entweder F12 oder rechte Maustaste und Element untersuchen) das Styling durchgeklickt. Dazu 2 Bilder die aufzeigen woran das liegt.

Wie das lösen?

1. Ansatz - die beiden Felder auf Seitenbreite (100%) und untereinander stellen!
2. Ansatz - erstes Bild, das "margin-right: 35%; verkleineren, da reichen 5% sicher!
   Weiters ist "nf-field-label" die Breite mit "width:"auf "auto" gestellt das offensichtlich ein Leerzeichen als Umbruch übernimmt.

Für Änderungen mein Kopiersatz!
Die Style-Anpassungen werden unter Design - Customizer - Zusätzliche CSS gemacht werden! LINK.

versuche es mit

border: 0!important;

Original lautet die Anweisung:

.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
    border: 1px solid #dfc7b2;
    float: left;
    clear: none;
    display: block;
    min-height: 410px;
}

border = Rahmen
1px = 1 Pixel breite
solid - durchgehende Linie
#dfc7b2 = Farbcode

LINK