HTML-Elemente finden und in CSS ansprechen

    Joomla Version
    4.2.9
    PHP Version
    PHP 8.1.x
    Hoster
    IONOS
    Link (URL) zur Seite mit dem Problem
    https://theatergruppe.sv-almenrausch.de

    Liebe ExpertInnen,


    eine simple Anforderung bringt mich zum Scheitern, weil ich es nicht hinkriege, ein HTML-Element zu finden und dieses Element dann per CSS umzugestalten.


    Am Beispiel zeigt es sich leichter: Ein Menü-Container(?) soll runde Ecken bekommen. Im Inspector meine ich den Kasten gefunden zu haben, Klick auf [flex] umrandet ihn. Nun lese ich oben am Kasten .sidebar-left.card.vmenu

    und im HTML

    <div class=sidebar-left card vmenu"> [flex]


    und denke mir, im user.css zu schreiben


    /* side-bar Ecken abrunden */

    .sidebar-left.card.vmenu {

    border-radius: 18px

    }


    sollte es tun. Tut es aber nicht. Was mache ich falsch?


    Mir fällt auch auf, dass der Eintrag in die user.css im Inspector nicht zu finden ist.

    Diesen Code in deine user.css einfügen um das Menü in der Sidebar mit abgerundeten Ecken zu erzeugen:

    Code
    .container-sidebar-left .sidebar-left:first-child {
  margin-top: 1em;
  border-radius: 18px;
}

    für das untere Element in der Sidebar links dann noch:

    Code
    .container-sidebar-left .sidebar-left:last-child {
  margin-bottom: 1em;
  border-radius: 18px;
}

    Hallo,


    also die Codes: #1 und #2 täten passen.

    Das andere habe ich mir nicht angeschaut, weil ich nicht weiß, wo Du den Code #1 reingegeben hast. Am Ende der user.css zeigt es Wirkung.


    Aber es hängt hier:

    Code
    /* .container.sidebar-left.card.vmenu {  */
    .card { 
     background: #aaa         
      border-rradius: 18px 
}

    nach dem background segment braucht es ein ; (semikolon).

    Und: border-rradius: 18px


    Liebe Grüße

    Christine

    Moin,


    eines ist jedenfalls sicher: Ihr seid die Besten!


    Blöder kan's nicht gehen: In meinem Tableau von Fenstern und Tabs war mir entgangen, dass ich die Seite schon mal geöffnet hatte. Daraufhin hat der FF die Vorschau nicht neu aufgebaut, sondern aus dem Cache gezogen, deshalb habe ich weder irgendeine Änderung gesehen noch die neuen Elemente im Inspector gefunden. Ein ganzer Nachmittag für die Katz...


    Die Lösung von zero ist die einfachste, und sie klappt.

    christine2 hat meine Tipp- und Syntaxfehler gefunden - den ersten hatte ich eingebaut, um im Inspector das gelbe Dreick zu erzwingen, mit dem abschließenden Semikolon fremdle ich noch. Könnte der Parser doch selber dranfummeln ;)

    Elwood: Das schau ich mir mal in Ruhe an.

    WM-Loose: Die beiden childs (children?) erben von card, deshalb reicht die Angabe bei card aus. Immerhin zeigt Deine Lösung, wie man die Elemente exakt ansprechen kann, wenn man's mal braucht.


    @all: Nochmal ein riesengroßes Dankeschön!