HTML、CSS：color not working

Question

私はウェブサイトを構築していますが、何らかの理由で私のcolor: whiteが動作しません。

機能していませんコード：

.main-navbar-heading-2 { 
    position: absolute; 
    top: 5px; 
    left: 5px; 
    text-decoration: none; 
    color: white !important; 
    font-family: Raleway; 
    font-size: 1.3em; 
} 

マイフィドル：https://jsfiddle.net/5rpy02er/

Answer 1

あなたのテキストは、他の層の背後にあります。 Zインデックスを置く：

z-index: 10; 

は、それが働いて参照してください：

https://jsfiddle.net/5rpy02er/1/

PS：色が完璧に働いています。色は細かい問題を取り組んでいる

Answer 2

はここにあなたのzインデックスを持つ

.main-navbar-heading-2 { 
     position: absolute; 
     top: 5px; 
     left: 5px; 
     text-decoration: none; 
     color: white !important; 
     font-family: Raleway; 
     font-size: 1.3em; 
     z-index:9; 
    } 

で更新フィドルです：https://jsfiddle.net/5rpy02er/2/

Answer 3

はちょうどそれメインナビゲーションバー-見出し-2へのzインデックスを追加します。

z-index:10; 

Answer 4

だけで、さらに精度、あなたはそれがうまく働いて、colorに!importantプロパティを配置する必要はありません。

プロパティはabsoluteポジションと最初の位置にあるため、これを追加する必要があります。デフォルトでは、値は1に設定され、2番目の要素の値は2になります。

これは2と同じかそれ以上の値を入れて、の100%を占めるもう一方の前に表示させる必要があるためです。

SOよりz-index財産の使用を理解するには、この非常に良い記事を参照してください： Z-Index Relative or Absolute?