2011-08-15 9 views
2

I次のコードを持っている:floatを停止する方法:divをdivで覆い隠すことからleft div?

<div> 
    <div onmouseover="this.style.color='red'" 
     onmouseout="this.style.color='blue'" 
     style="float:left"> 
     a 
     <br/> 
     b 
     <br/> 
     c 
    </div> 
    <div onmouseover="this.style.color='red'" 
     onmouseout="this.style.color='blue'" 
     style="position:relative;"> 
     Testing, one two three... 
    </div> 
</div> 

最初のdivは右側にある2番目のdiv内のテキストをプッシュではなく、第二のdiv自体、その第一の内側のdiv内aがによって隠蔽されます2番目の内側のdivにTがあり、aをホバーするとonmouseoverがトリガーされません。

これは非常に単純な例ですが、最初のdivが表示される場合と表示されない場合があるので、どのようにして2番目のdivのposition:relativeを保存し、余白を追加しないで、このようなレイアウトを取得しますか? 2番目のdivが最初の部分を隠すことは奇妙に思えます。

+0

ここに記載されているHTML /スタイルでは、これらの要素に重複するテキストはありません。これが問題を再現する全体のサンプルだと確信していますか?すべての適用されたスタイルを含む、より多くのコードをコンテキストに提供できますか?どのブラウザ/バージョンで問題が発生していますか? –

+0

テキストは重複していませんが、このコードを試してみると、onmouseoverイベントが 'a'のために機能していないことがわかります – yuttadhammo

答えて

4

私があなたを正しく理解していれば、float: left;を2番目のdivにも入れてください。

+0

あなたは私を完全に理解しています...ありがとう、魅力:) – yuttadhammo

+0

答えをありがとう。シンプルだが、トリックをした。 –

関連する問題