Background-image, Navi-Leiste transparent

    Hallo,

    ich finde Gefallen am Layout dieser Seite (Typo3).


    1. Der Hintergrund lappt oben/unter über.

    2. Die Navi-Leiste ist transparent.


    Im Joomla kann ich mit

    .itemid-10 > .body {

    den body einfärben, die Fläche geht aber nicht über

    .itemid-10 > .body > .container {

    hinaus und endet oben/unten scharf.


    In gleicher Art kann ich die Navi-Leiste einfärben aber nicht transparent machen. Oder doch?


    Kann mir jemand auf die Sprünge helfen?


    vG

    Ok,

    das 'Überlappen' hab' ich geklärt (hätte ich sofort daruf kommen müssenfie)

    .itemid-10  {

    Also ohne .body!

    Lösungsstrategie: Ums Haus gehen, Flasch Bier und dann kommt's


    aber mit der Traanparenz fällt mir nichts ein.

    Ich würde mal so ins Blaue reinratend sagen, du musst die erste nicht-transparente Hintergrundfarbe erst einem Element weiter innen vergeben, das das Menü nicht mit einschließt. Hast du zu deiner Seite vielleicht einen Link? Sonst wird das mit genaueren Tipps schwierig.

    Inzwischen habe ich diverse Tutorials zum Thema gesichtet, kann aber nicht erkennen, wie sie es denn nun gemacht haben.


    Zur Demo habe mal in user.css eingetragen

    Code
    .nav {
background: rgb(0, 255, 0, 0.5);
}

    Da offentbart sich aus das nächste Problem, dass noch ein Rand zum Container besteht.

    Uhps, ich habe den Link vergessen!

    Und mit

    Code
    .nav {
/*background: rgb(0, 255, 0, 0.5);*/
/*background: rgb(0, 255, 0, 0.0);*/
background: transparent;
}

    funzt es auch nicht.

    Hallo,


    meine Bemühungen, die Navigation - wie in der Vorlage - transparent zu machen, beruhen auf einem grundsätzlichen Irrtum.

    Die .nav ist von Hause aus transparent!

    Man merkt es nur nicht sofort, weil eine Ebene tiefer der .content mit seiner (weißen) Farbe den Durchblick auf den noch eine Ebene tiefer gelegenen Seitenhintergrund verhindert.


    Also erstmal den ganzen Container transparent machen
    .body > .container {

    background: transparent;

    }


    Danach die gewünschten Bereiche in den jeweiligen Klassen mit background-color: #fff; wieder einfärben:

    .header {..}, Berichte über die Seitenklasse des Menüs .willkommenBG {..}  und position-7 mittels .itemid-nnn > .body > .container > .row-fluid {..}.


    Der Text in den Berichten steht jetzt ziemlich an den Rand gedrängt; unschön.

    Ich versuche es im JCE mit Padding/Margin unter 'CSS-Stil bearbeiten'.


    Hmm, alles sehr aufwändig und ob es nun sooo toll aussieht?!

    Aber als Machbarkeitsstudie ganz nett.


    vG