Css-Display auf der Rückseite

Question

ich dieses Bild 1 Aussehen 2. wie das Bild wollen

Bild 1

Bild 2

Hier ist meine css von oben -message Klassenname, der in roter Farbe ist.

.top-message{ 
    position: fixed; 
    z-index: 1030; 
    height:22px; 
    width:100%; 
    margin-top:-2px; 
} 

Answer 1

.top-message{ 
    position: fixed; 
    top:0; 
    left:0; 
    z-index: 1030; 
    height:22px; 
    width:100%; 
    margin-top:0; 
} 

Answer 2

Es kommt an die Spitze wegen

z-index: 1030; 

Z-Index

Sie müssen sicherstellen, dass die Drop-Down-Menü z-index höher als top.message

Answer 3

Stellen Sie sicher, Die z-index der Sidebar ist mehr tha n z-index der Top-Nachricht. Wenn es funktioniert und immer noch nicht funktioniert; Versuchen Sie, position: relative; an die Seitenleiste zu geben.

Answer 4

Angenommen, Sie haben Container für jedes der Elemente, wie die anderen gesagt haben, sollten Sie sicherstellen, dass der rötliche Alarm einen kleineren Z-Index-Wert als das Menü/nav bar auf der linken Seite hat. Meiner Meinung nach würde ich einen äußeren Container mit einer absoluten Position setzen und die verbleibenden inneren Container, die die obere Navigationsleiste, rote Alarmmeldung und das linke Menü mit einer relativen Position bilden, setzen. Stellen Sie sicher, dass die von Ihnen festgelegten Z-Index-Zahlen mit dem Anfangswert 0 beginnen und um 1 erhöht werden, wenn Sie den Code "kaskadieren".

Answer 5

wird dieser Link Understanding CSS z-index helfen