0

この2つは同じように見えるはずなのに、まったく違うように見える

 <div id="sidebar">
      <a href="post.php"><img class="button" src="/media/post.png"/></img></a>
      <a href="logout.php"><img class="button" src="/media/logout.png"></img></a>
 </div>

 <div id="sidebar">
      <input type="image" src="/media/submit.png" name = "submit" class="button" />
      <a href="logout.php"><img src="/media/logout.png" class="button" ></img></a>
      <a href="main.php"><img src="/media/back.png" class="button" ></img></a>
 </div>

それらはdivscssを使用する他のすべて/他のものの外側にあり、</body>タグはそれらのボットのすぐ下にあります

#sidebar {
    position: fixed;
    display: block;
    top: 20%;
    width: 5px;
    right: 100px;
}

それが何かを意味する場合、クロム開発者ツールが<a>それらの一方と他方ではなくその間に表示され、それが違いを生み出しています。画像リンクを作成するより快適な方法があれば教えてください。

編集：これらは1つの2つの異なるページであることを追加する必要がありました.

編集：それはおかしなDoctypeでした:(

二度と。非常に多くの時間を無駄にしました。とにかくありがとう [=

4

5 に答える 5

1

同じ名前のIDは1つしか持てないからです。それらをクラスに変更するか、次のようなcssセレクターを使用して別の名前に変更することを検討してください

#sidebar1, #sidebar2{

}
于 2013-02-21T05:02:36.563 に答える
1

あなたはそれ自体でタグを閉じており、もう一度閉じよimgうとしてい</img>ますが、もう 1 つは で 2 つdiv'sあり、same idどちらが間違っていますか。

示されているように、それらunique id'sに a を付けたり追加したりしてみてくださいclass

<div id="sidebar1" class="sidebar">
      <a href="post.php"><img class="button" src="/media/post.png"></img></a>
      <a href="logout.php"><img class="button" src="/media/logout.png"></img></a>
</div>

<div id="sidebar2" class="sidebar">
  <input type="image" src="/media/submit.png" name = "submit" class="button" />
  <a href="logout.php"><img src="/media/logout.png" class="button" ></img></a>
  <a href="main.php"><img src="/media/back.png" class="button" ></img></a>
</div>
于 2013-02-21T05:03:47.643 に答える
0 
/*CSS*/
.sidebar {
      position: fixed;
      display: block;
      top: 20%;
      width: 5px;
      right: 100px;
 }

<!-- HTML -->

<div class="sidebar"> <!-- replace both "id" with "class" like this -->
于 2013-02-21T05:18:53.550 に答える
0

DOMID が同じでない場合、それらは同じに見えます。

試す

<div class="sidebar">
      <a href="post.php"><img class="button" src="/media/post.png"/></img></a>
      <a href="logout.php"><img class="button" src="/media/logout.png"></img></a>
 </div>

 <div class="sidebar">
      <input type="image" src="/media/submit.png" name = "submit" class="button" />
      <a href="logout.php"><img src="/media/logout.png" class="button" ></img></a>
      <a href="main.php"><img src="/media/back.png" class="button" ></img></a>
 </div>

CSS

.sidebar 
 {
      position: fixed;
      display: block;
      top: 20%;
      width: 5px;
      right: 100px;
 }
于 2013-02-21T05:10:20.037 に答える
0

他の人が言ったことを繰り返すだけです... idの代わりにクラスを使用してください。そのように img タグを閉じる必要はありません。これは、テスト目的でいくつかの調整を加えた jsFiddle ですhttp://jsfiddle.net/cVMdM/1

更新されたhtml

 <div class="sidebar">
      <a href="post.php"><img class="button" src="/media/post.png"/></a>
      <a href="logout.php"><img class="button" src="/media/logout.png"/></a>
 </div>

 <div class="sidebar">
      <input type="image" src="/media/submit.png" name = "submit" class="button" />
     <a href="logout.php"><img src="/media/logout.png" class="button" /></a>
     <a href="main.php"><img src="/media/back.png" class="button" /></a>
 </div>

更新されたcss

.sidebar{}
于 2013-02-21T05:14:31.683 に答える