Kopfzeile wird nicht auf anderen Seiten als der Hauptseite angezeigt

Question

So, ich habe einen Header auf der Hauptseite meiner Website. Es ist perfekt ausgerichtet und alles ist gut, aber wenn ich auf eine andere Seite gehe, verschwindet die Kopfzeile. Ich habe es mit und ohne Position ausprobiert: behoben, aber es verschwindet immer noch. Der Platz, wo es sein sollte, ist immer noch da, aber der Header selbst ist unsichtbar, denke ich.

Ich habe ein anderes Div, das zwischen den Seiten bleibt, so dass ich nicht weiß, was könnte das Problem sein. Ich habe den zwei CSS-Codes verglichen, aber die einzigen Unterschiede sind Positionen, Farben, Größen etc.

Dies ist die CSS für den Header:

.bar { 
    margin-top:-810px; 
    margin-left:300px; 
    width:1075px; 
    height:60px; 
    background-color:#b0b0b0; 
    font-size:16px; 
    color:#e7e55a; 
    text-align:center; 
    line-height:60px; 
    font-family: 'Coming Soon', cursive; 
    position:fixed; 
    z-index:1; 
} 

Und das ist die CSS des anderen div dass bleibt an seinem Platz:

#tra img { 
    width: 225px; 
    height: auto; 
    margin-top:60px; 
    margin-right:0px; 
    transform:rotate(-55deg); 
    z-index:1; 
} 

Da das zweite div ein Bild ist, ich denke, das könnte sein, warum es nicht verrutscht, aber ich bin wirklich nicht die beste an Codierung, so dass jede Hilfe ist willkommen.

Auch habe ich den Code ohne Z-Index versucht, aber es hat immer noch nicht funktioniert.

Answer 1

Wenn Sie eine feste Position verwenden, verwenden Sie oben, links, unten und rechts, um Ihre Elemente zu positionieren. Verwenden Sie keine Marge.

.bar { 
 
    top: 0; 
 
    left: 300px; 
 
    
 
    width:1075px; 
 
    height:60px; 
 
    background-color:#b0b0b0; 
 
    font-size:16px; 
 
    color:#e7e55a; 
 
    text-align:center; 
 
    line-height:60px; 
 
    font-family: 'Coming Soon', cursive; 
 
    position:fixed; 
 
    z-index:1; 
 
}

<div class="bar"></div>