Internes

CSS, wer kennt sich aus?

haessliche kante

Heute habe ich die Sidebar auf der rechten Seite des Bestatterweblogs etwas verschlankt und überarbeitet.
Und da gibt es eine Stelle, es wird vielleicht sonst kaum jemandem auffallen, die mir persönlich nicht gefällt.

Es ist diese Stelle hier:

haessliche kante

Werbung

Hinter der Sidebar liegt ein Hintergrund mit dem Attribut „gradient“. Das wirkt sich nach links und rechts aus, indem die leicht graue Hintergrundfarbe sich ausschleicht.
Mir ist aber kein CSS-Trick bekannt, wie ich „gradient“ auch gleichzeitig auf oben und unten anwenden kann.

Hat irgendjemand eine Idee, wie ich diese etwas harte Kante da oben wegbekomme?

Bildquellen:


    Ich habe noch einmal die wichtigsten Schlagwörter (Hashtags) dieses Artikels für Sie zusammengestellt, damit Sie sich besser orientieren können:

    Keine Schlagwörter vorhanden

    Rubrik INTERNES

    In dieser Rubrik finden Sie alles über interne Vorgänge und Sachverhalte dieses Weblogs. Das Bestatterweblog.de ist die größte Ratgeberplattform zum Thema Bestattung und Trauer und bringt darüberhinaus immer wieder unterhaltsame Geschichten.

    Lesezeit ca.: 1 Minute | Tippfehler melden | Peter Wilhelm: © 4. September 2015

    Hilfeaufruf vom Bestatterweblog

    Das Bestatterweblog leistet wertvolle journalistische Arbeit und bietet gute Unterhaltung. Heute bittet das Bestatterweblog um Ihre Hilfe. Es fehlen in diesem Jahr noch etwa € 8.500,- um den Server, IT, Redaktion und um die anderen Kosten zu decken. Bitte beschenken Sie uns mit einer Spende, sonst müssen wir in Zukunft die meisten Artikel kostenpflichtig bereitstellen. Das wäre schade, auch weil das weitere unkreative Arbeiten erfordert, die wir zeitlich kaum stemmen wollen. Vielen Dank!




    Lesen Sie doch auch:


    Abonnieren
    Benachrichtige mich bei
    17 Kommentare
    Inline Feedbacks
    Alle Kommentare anzeigen
    Bailara
    9 Jahre zuvor

    Ich weiß nicht, ob das nur bei mir so aussieht, aber:
    Auf der Startseite wird mir zweimal der Reiter Kaffeekasse angezeigt (Bild mit dem Schädel und der Hand)
    Auf der einzelnen Artikel Seite bekomme ich nur einen Reiter Kaffeekasse dafür aber auch ein anderes Bild (Mit der Euro Münze und dem Schädel)

    Reply to  Bailara
    9 Jahre zuvor

    @Bailara: Das sind Nachwehen der Umbauarbeiten. Das dürfte inzwischen weg sein.

    Leo
    9 Jahre zuvor

    Kenne mich natürlich NICHT aus, aber wenn es nicht nur linear sein soll, sondern in alle Richtungen gehen soll – gibt es die Option „radial“? Das steht zumindest bei Photoshop für kreisförmig wirkende Filter, Weichzeichner, Verläufe etc.

    Leo
    9 Jahre zuvor
    Reply to  Leo
    9 Jahre zuvor

    @Leo: Ja, hilfreich. Vielleicht muß man sich so helfen. Aber das ist kreisrund bzw. elipsenförmig.
    Ich suche einen geraden Verlauf.

    Wir kriegen das schon hin 🙂

    Leo
    Reply to  Peter Wilhelm
    9 Jahre zuvor

    @Peter Wilhelm:
    Hm… dann bietet PS noch einen sog. Rautenverlauf an;
    keine Ahnung, ob es da was Entsprechendes im css-Land gibt?
    Aber mal andere Frage – warum muss da denn unbedingt was dahinter?
    Man kann doch alles erkennen…? Weniger ist mehr..;o)

    Chris
    9 Jahre zuvor

    Hi Peter,

    ich habe auf die schnelle für aktuelle Browser das hier gefunden.

    http://www.w3schools.com/css/css3_gradients.asp

    Für dein Problem wäre ein radialer Gradient, dessen Center sich in der Knopf-Box unten mittig befindet, wohl am besten geeignet.

    vg

    Chris

    9 Jahre zuvor

    Die einfachste Lösung dürfte eine entsprechende Hintergrund-Grafik sein. Sind zwar wieder kein paar kB mehr, wäre aber mein Ansatz.

    Keep it Country,
    Markus

    Frank
    9 Jahre zuvor

    Versuch es doch mal mit „boxshadow“ statt „gradient“:
    http://www.cssmatic.com/box-shadow
    Horizontal Length: 0
    Vertical Length: 0
    Blur Radius: 0
    Spread Radius: 0
    Shadow Color: #ffffff
    Background Color: #ffffff
    Box Color: #d6d6d6
    Opacity: 1
    Inset

    Frank
    Reply to  Frank
    9 Jahre zuvor

    @Frank:
    Es sollte natürlich heißen:
    Blur Radius: 80
    Spread Radius: 40

    Reply to  Frank
    9 Jahre zuvor

    Und natürlich überall die Zeilen mit Semikolon abschließen, sonst gibt es ungewollte Probleme. 🙂

    Ich selbst würde es komplett ohne Hintergrund machen, denn alles andere in der Sidebar hat auch nichts dahinter.

    Leo
    Reply to  NetzBlogR
    9 Jahre zuvor

    @NetzBlogR:
    Sag ich doch..;o))

    Max Müller
    9 Jahre zuvor

    Ich wunderte mich gerade: „was für eine Seitenleiste?“
    Achso die da unten. Hat man bei einem Laptop mit völlig unzureichender Auflösung von sowas um die 1366×768 Pixel in Firefox auch noch eine Lesezeichenleiste offen, wird die Seitenleiste eher zur Fußleiste. Zumindest solange, bis man die Lesezeichen wieder zusammenschiebt.

    Reply to  Max Müller
    9 Jahre zuvor

    @Max Müller: Ja, das stimmt. Das ist so eingestellt, daß bei kleinen Monitoren, bzw. wenn man das Browserfenster stark verkleinert, irgendwann die Seitenleiste ausgeblendet und unterhalb des Hauptfensters angezeigt wird. Das ist Absicht.

    at
    9 Jahre zuvor

    Ein radialer Verlauf löst das Problem nicht zufriedenstellend. Die CSS-Eigenschaft background verarbeitet aber als Wert auch mehrere Verläufe, dann kommasepariert. Die Verläufe überlagern sich dann, so dass (Teil-)Transparenzen eingesetzt werden sollten, siehe: http://www.sitepoint.com/css-gradients-a-syntax-crash-course/

    Konni Scheller
    9 Jahre zuvor

    Zwei Container. Pack die nochmal in ein , und dem einen Container gibst du den einen Verlauf, dem anderen eben den entsprechenden.

    Schwafel
    9 Jahre zuvor

    http://www.colorzilla.com/gradient-editor/

    was der nicht kann geht auch nicht

    HTH




    Rechtliches


    17
    0
    Was sind Deine Gedanken dazu? Kommentiere bittex