Hintergrundfarbe für Überschrift vs. entry

  • ...es fällt mir schwer, mein kleines Problem mit Worten zu beschreiben, daher ergänzend eine kleine Grafik.

    Meine Seiten- bzw. Artikelüberschrift habe ich u.a. mit dieser CSS Definition bedacht:

    Code
    background: #a4cae7;
         padding: 8px 0;
         display: block;

    Das führt in meinem Fal dazu, dass die volle Breite meiner Überschriftszeile mit der bg-Farbe ausgefüllt ist - so will ichdas auch.

    Das Problem ist, dass sich sowohl der Inhaltstext als auch die Überschrift in der gleichen Klasse (.entry) befinden. Das führt dazu, dass die bg-Farbe der Überschrift nur soweit nach links reicht wie der Text.

    Ich wünsche mir aber, dass die bg-Farbe bis zum nächsten Container auf der linken Seiten (in dem Fall das Menü) reicht und der Beitragstext ca. 40px nach rechts eingerückt beginnt. Wie löse ich das (am besten)?

    Falls mich jemand verstanden hat, hat dieser jemand vielleicht auch eine Idee?

    Danke & schönes WE
    Daniel

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • ein Link zur Seite würde helfen beim helfen :lol:

    du musst die Überschrift dann separat ansprechen

    also z.B.

    Code
    .entry h3

    oder wie auch immer das bei dir aussieht

    und mit margin kannst du ja verschieben

  • du schon wieder :-)

    wenns einen link auf meine festplatte/XAMPP gäbe... ein freund, der (v.a. textil-) grafiker ist, aber nix mit dem web am hut hat, hat mir einen entwurf als png gegeben und drum gebeten, das mittels css & wordpress umzusetzen.

    vielleicht hilft ein größerer ausschnitt - um den roten kasten gehts...

    du kannst es nicht wissen, aber ich glaube eigentlich etwas mehr als basis-css-kenntnisse mittlerweile zu haben (--> "margin"). aber ich glaube, in diesem fall weniger css-erläuterungen zu benötigen, sondern viel mehr wie ich die einzelnen container (h2, entry, post usw.) in wp am cleversten anordne.

    momentan liegt halt die überschrift im entry-bereich. kann ich die seiten-/titelüberschrift denn vom inhalt trennen ohne dass das zu fehlern bei der ausgabe führt...?

    jedenfalls danke für deine hilfe!

  • Zitat

    du kannst es nicht wissen, aber ich glaube eigentlich etwas mehr als basis-css-kenntnisse mittlerweile zu haben (--> "margin").

    dann dürfte das ja kein Problem für dich sein

    und ich trau mich ja schon nicht mehr Tips zu geben, könnte dich ja damit langweilen

    Mal als Beispiel über Firebug den Blog in deiner Sig. bearbeitet
    sind zwei kleine Änderungen und denke die gleiche Situation.

    Einmal editiert, zuletzt von Tutrix (7. Januar 2011 um 22:46)

  • hach...

    das ist immer das gefährliche beim schreiben - man wird da schneller missverstanden als im gespräch.

    also nochmal unmissverständlich:
    ich bin dir und jedem anderen für hilfe dankbar
    was margin ist und noch ein paar andere dinge weiß ich
    ich kenne aber sicherlich auch ganz viele css nicht
    wie teilt man jemandem schriftlich mit, welche kenntnisse man hat und welche nicht bzw. wie schätzt man sich am besten selbst ein. da hat ja auch jeder andere vorstellungen davon. wahrscheinlich geht man beim erklären (wie du hier) aber tatsächlich davon aus, dass der andere nix weiß. insofern hätte ich mir mein hinweis im beitrag zuvor vermutlich sparen können - okay, sorry.


    zurück zum thema:
    hab ich jetzt nicht ganz verstanden: du hast mein blog genommen und in firebug (kenne ich noch nicht) dazu gebracht, die überschrift bis zum linken rand anzuzeigen? dann würde mich in der tat der code interessieren. dafür hast du jetzt aber nicht nur an den css rumgeschraubt - oder etwa doch?

    danke nochmals & viele grüße

  • dafür hast du jetzt aber nicht nur an den css rumgeschraubt

    doch nur rumgeschraubt ..... und Firebug findest du in meiner Sig.

    der Schraubercode (gilt für die Seite in deiner Sig)

    Code
    margin: 0 0 5px [COLOR=Red]-40px;[/COLOR]

    die -40px sorgt dafür, das der Bereich 40px nach links rutscht

    Code
    [COLOR=Red]padding-left: 40px;[/COLOR]

    sorgt dafür, das die Überschrift bleibt wo sie ist

    ist zumindest die schnellste Lösung, ohne die Inhalte neu anzuordnen

  • ich bin platt.

    nach zweimaligem durchlesen würde ich sagen, das muss es sein.

    und an die -40 hab ich nicht gedacht, das nutze ich bisher nicht.

    DANKE!

    EDIT: funktioniert!

    Einmal editiert, zuletzt von schelm (8. Januar 2011 um 16:47)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!