Dreifarbiger Balken zerschießt das Design

  • Hallo!


    Wie man wohl am Nutzernamen sehen kann, heiße ich Laser und komme aus dem schönen Ulm.
    Ich bastele seit längerem an einigen Wordpress-Seiten und konnte mir bisher meist mit Tante Suchmaschine helfen.
    Jetzt komme ich aber nicht weiter.

    Ich hoffe, ich bin im richtigen Unterforum (und es ist ok, wenn die Seiten politisch sind...)

    Ich habe auf einer Seite dreifarbige Balken gemacht.

    Code
    <div style="width: 660px;height: 15px;background-color: #000">
    <div style="width: 70%;height: 100%;background-color: lightgrey;font-size: 12px">
    <div style="width: 17px;height: 100%;background-color: #B91023;font-size: 12px;color: #fff">&nbsp;70%</div>
    </div>

    https://die-partei.net/ulm/frag-nicht…hrift%20leisten


    https://die-partei.net/ulm/frag-nicht…hrift%20leistenAlles ok, Theme unbekannt

    TwentyEleven
    Der Text ab dem Balken geht über den Hintergrund hinaus.

    Confit
    Der Text bricht nach dem Balken ab.

    Nehme ich aus dem obigen Code eine Zeile raus, also nur 2 Farben für den Balken, paßt alles.


    Woran könnte das liegen? Wo muß ich ansetzen?


    Dank und Gruß
    Laser

    • 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

  • Deine div`s sind nicht richtig geschlossen. wenn du ein balken wegmachst, dann passt es mit den schließendes divs wieder. es fehlt ein </div>.

  • Argl... Danke!
    Manchmal bin ich ein Idiot.

    Und bei der einen Seite wird es auch nicht richtig dargestellt, wenn man genau hinschaut... Am Rand des weißen Felds erscheint da ein grauer Schatten.


    Danke nochmals
    Laser

Jetzt mitmachen!

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