質問
私はい"ボックスを右下のボーダーのページを動かさないように、ページの幅です。もの作業ではないかゃうのではないでしょうか。こちらは自分のコード:
<html>
<head>
<style type="text/css">
.tooltip {
width: 200px;
position: fixed;
top:auto;
bottom:0px;
right:0px;
left:auto;
}
</style>
</head>
<body>
<div class="tooltip">
<div class="tooltip_top">1</div>
<div class="tooltip_con">2</div>
<div class="tooltip_bot">3</div>
</div>
</body>
</html>
解決
それはFFとChromeで正常に動作します..
IEの古いバージョンが正しくposition:fixed
をサポートしていませんでした...いないことを確認最新バージョンに関する..
また、あなたは、DOCTYPE定義されていることを確認してください..
他のヒント
私はIE7を信じているし、大きなあなたがどこその上で開始するために理解していない場合は、「Quirksモード」を検索、DOCTYPEを定義する必要があります....私のために働いているようだ。
私はIE6の位置をサポートしていないと思う:固定
えっ、動作するはずです。たぶんtop: auto
を削除しますか?
(それはIE 6とposition: fixed
をIE 6での作業をサポートしていないではないだろう、けれどもます。
あなたのHTML / CSSはIEだけで壊れています。 position: fixed;
へposition: absolute;
からの変化と、それはあなたがそれを望む多くのように動作するはずです。
また、DOCTYPE要素を適用することができます
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
あり、なくてはならない事がいくつかの
- 書のDOCTYPEが経過す。
- のCSSプロパティの位置を固定する設定"によってサポートされていないIE6...それに基づいており、また以下の"位置:絶対"で---その他の特性を維持する。
すべての答えを持っていることを「大きなコード」 なぜ、いけないアドオンのdiv要素に「固定」 このように:
div position: fixed;
そして「それよ:D 希望それはあなたのために働く。
<html>
<head>
<style type="text/css">
.header {
width: 100%;
height:100px;
position: fixed;
top:0px;
left:0px;
}
</style>
</head>
<body>
<div class="tooltip">
<div class="tooltip_top">1</div>
<div class="tooltip_con">2</div>
<div class="tooltip_bot">3</div>
</div>
</body>
</html>
任意の位置の問題に関連するそのビューのこのリンクをたどってきたいくつ迅速なソリューション.
http://learnlayout.com/position.html
固定
固定要素の相対位置を指定して配置のビューポート、常に同じ場所の場合でも、ページがスクロール.との対比の上、右下、左性を使用します。
ていらっしゃることだと思いますっていることに気付固定要素の下のページです。私はお得に注意してもらいたい。こちらはCSSでもコメントありがとうございます
.fixed {
position: fixed;
bottom: 0;
right: 0;
width: 200px;
background-color: white;
}
相対
相対的な動作と同じ静ない限り、加えます。
.relative1 {
position: relative;
}
.relative2 {
position: relative;
top: -20px;
left: 20px;
background-color: white;
width: 500px;
}
絶対
絶対的に優位置す。絶対のように動作すの固定を除く相対的に最寄りの位置が上位ではなく相対的にビューポートです。場合には絶対に位要素が位置づけ、先祖の書体も動きのページをスクロールします。覚えて、"位置"の要素はその位置にあるものを除く。
ここでは、簡単な例:
.relative {
position: relative;
width: 600px;
height: 400px;
}
.absolute {
position: absolute;
top: 120px;
right: 0;
width: 300px;
height: 200px;
}
このような何かが動作するはずです。
<style>
#myheader{
position: fixed;
left: 0px;
top: 95vh;
height: 5vh;
}
</style>
<body>
<div class="header" id = "myheader">
</body>
.tooltip {
width: 200px;
position: fixed;
bottom:0px;
right:0px;
}