Apostroph schwebende Widgets unter Bootstrap feste Navbar

Ich verwende Bootstrap v3.3.7 mit Apostrophe CMS. Mein navbar ist ein fester navbar mit dem navbar-fixed-top Stil, der die folgende CSS hatApostroph schwebende Widgets unter Bootstrap feste Navbar

.navbar-fixed-top { 
    position: fixed; 
    right: 0; 
    left: 0; 
    z-index: 1030; 
    top: 0; 
    border-width: 0 0 1px; 
}

Wie kann ich all die Apostrophe Admin-Widgets machen immer über meinem festen navbar angezeigt werden? Gibt es eine Möglichkeit, ich kann nur den Z-Index global oder etwas mit einigen CSS-Override erhöhen? Es sieht aus wie dieses

die offensichtlich hässlich und aufdringlich ist.

Quelle

2017-01-15 Carson

ist die HTML-Widget-+ CSS ? Es sieht so aus, als hätte es eine absolute Positionierung und da die Navigationsleiste fest ist, wird es vom Widget-Element nicht beeinflusst. Wie auch immer, wenn das Widget-Element eine feste Höhe hat, versetze einfach die Navigationsleiste von [top] (http://www.w3schools.com/cssref/pr_pos_top.asp). – Cooleronie

Ja, die Widgets werden vom CMS als eine Art Menüsystem zum Bearbeiten von Live-Seiten eingefügt. Allerdings verstehe ich nicht, was Sie mit "Offset der Navigationsleiste von oben" meinen, da die Navigationsleiste auf "top: 0" festgelegt ist. Ich frage mich, ob es einige CSS gibt, die ich überschreiben kann, oder vielleicht ein JavaScript-Hook, mit dem ich wissen kann, wann die Widgets vorhanden sind. – Carson

Ja, überschreiben Bootstrap mit CSS ist in Ordnung hier. Laden Sie Ihre benutzerdefinierte CSS nach Bootstrap in der Kopfzeile und in Ihrem eigenen CSS hinzufügen '.navbar {top: $ px}' wo '$' ist die Höhe des Widgets. Erstellen Sie für eine vollständige Lösung einen js-Listener, der die Eigenschaft css 'top 'für die' navbar' ändert, wenn das Widget im DOM gerendert wird. – Cooleronie

änderte ich die z-index meine navbar z-index: 300; seit den apos-modal-blackout zu sein (was der abgedunkelten Bildschirm ein modales Konfigurationsfenster zu bezeichnen geöffnet ist) ein z-index: 350; Ich weiß nicht, ob dies irgendwelche negativen Nebenwirkungen in denen hat Rest der Seite, obwohl.

One auch ein js Skript schreiben könnte für die apos-modal-blackout Klasse zu beobachten und, wenn es die z-index ihrer navbar vorhanden ist, verändern sich durch das CMS erstellt und eingefügt auf weniger als 350.

Quelle

2017-01-16 01:02:53 Carson

Apostroph schwebende Widgets unter Bootstrap feste Navbar

Antwort

Verwandte Themen