同じIDのDivが重複しています

私は自分のページに2つのdivを持っていて、両方にクラス "nav"を与えました。私はいくつかの理由のために、彼らは直接に登場している、しかし、彼らは私のHTMLに表示される順序で次々に表示されるように同じフォーマットを持っているこれら二つのdivをしたい同じIDのDivが重複しています

.nav { 
border-radius: 1em; 
background-color: #0000BB; 
color: white; 
padding: 1em; 
position: absolute;//Fits size to content. 
margin: 1em; 
left: 50%; 
transform: translate(-50%); 
display: block 
}

：ここ

は私のCSSですお互いのトップ。しかし、 "display：block"属性でこれが起こらないようにすべきですか？

EDIT：CSSをIDからクラスに更新しました。

出典

2016-05-22 Brandon H.

ID **は一意である必要があります。また、1つのCSSルールだけでなく、[mcve]も提供する必要があります。そして、絶対配置された要素は、最も近い位置にある祖先に対して配置されます。 https://developer.mozilla.org/en-US/docs/Web/CSS/position#Absolute_positioning – j08691

のIDをクラスに変更してください。@ j08691のように、-idは一意である必要があります。 – gavgrif

私もクラスに変更すると問題は解決しません。 –

問題は、 "Position：absolute"プロパティを使用していることです。つまり、 "display"プロパティが機能しないことを意味します。代わりにposition： 'relative'を使用してみてください。

出典

2016-05-22 04:50:38 Johnnyenc

あなたのケースでは、IDの – Johnnyenc

の代わりにクラスを使用しました。しかし、私はdivをコンテンツと位置だけにしたいと考えています。divはページの幅全体に渡っています。 –

現在のコードでjsfiddleを作成できますか？ @BrandonH。 – Johnnyenc

同じIDのDivが重複しています

答えて

関連する問題