0

別の内部に Div があります。子 Div は、(css プロパティをアニメーション化することによって) JavaScript アニメーションを開始するリンクであり、ラッパーを配置した理由は、子を中央に配置してフロートさせたいからです。したがって、子 Div がセンタリングを行い、親がフロートを行います。margin:0 auto;その理由は、float:プロパティで行うことができないためです。

今私の問題は、子 Div の周りにリンクを配置すると、親 Div もリンクされることです! 現時点では本当に困惑しています。これは Chrome と Firefox で発生しますが、奇妙なことに IE では発生しません。誰が何が悪いのか知っていますか?

親は#eastereggwrapperで、子は#eastereggbuttonです。コード スニペット、私の HTML は次のとおりです。

<div id="eastereggwrapper">
  <a href="" class="secret" >
    <div id="eastereggbutton" >
      Don't Click Me
    </div>
  </a>
</div>

そして私のCSS:

#eastereggwrapper {
    background-color: black;
    bottom: 0px;
    width: 100%;
    position: relative;
    float:left;
}

#eastereggbutton {
    margin:0 auto;
    width:10%; 
    height:50px;
    background-color:green;
    color: black;
    font-size:18px;
    font-family:Tahoma, Geneva, sans-serif;
    text-align:center;
}

PSシークレットクラスは定義されておらず、Javascriptコードに使用されています。

4

2 に答える 2

1

追加するだけ

#eastereggwrapper > a {
    width:10%;
    display: block;
    margin:auto;
}

CSSに追加して削除します

margin:0 auto;
width:10%;

#eastereggbutton のプロパティから

于 2013-03-19T22:58:10.187 に答える
1

次の 2 つのいずれかを試してください。

  1. <a>2 番目の div の内側に配置します
  2. <a>子 div を次のタグに置き換えます。

HTML

<div id="eastereggwrapper">
  <a href="" class="secret" id="eastereggbutton">
      Don't Click Me
  </a>
</div>

CSS

#eastereggbutton {
    display: block;
    margin:0 auto;
    width:10%; 
    height:50px;
    background-color:green;
    color: black;
    font-size:18px;
    font-family:Tahoma, Geneva, sans-serif;
    text-align:center;
}
于 2013-03-19T22:51:32.573 に答える