2

サイドバーがあり、スクロールしたくありません。明らかに、トリックを行うか、position:fixedまたはposition:absolute行う必要がありますが、そうではありません!

では次のことが起こりますposition:fixed。

サイドバーがスクロール時に不具合を起こし、分割され、奇妙な動作をする

では次のことが起こりますposition:absolute。

サイドバーは所定の位置にとどまるのではなく、スクロールします。

サイドバーの CSS は次のとおりです (正しい ID 名ではありません)。

#sidebar{
font-family: 'Jura', sans-serif; 
position: fixed; 
margin-top:80px; 
margin-left:1020px;
font-size:18px;
padding-top:0px; 
padding-bottom:17px; 
text-align:center; 
height:420px; 
width:300px; 
overflow:hidden;
solid #000000;
color:#000000;
-webkit-transition: opacity 0.3s linear;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
background-color:transparent;
opacity: 1;
z-index:999;
}

これはブログへのリンクなので、開発者ツールでチェックして、不具合と正確に何が起こっているかを確認できます。

ポジショニングがおかしいのはなぜですか? どうすれば修正できますか?

そして、これはサファリとクロムで起こります。私はFirefoxやInternet Explorerをインストールしていないので、それらのブラウザの応答がわかりません

グリッチの画像、サイドバーの画像を分割し、時折テキストの一部を表示します:

ここに画像の説明を入力

4

2 に答える 2

1

overflow:hidden4 文字の F ワードを持つ要素から削除します。

#???? {
    font-family: 'Jura', sans-serif;
    position: fixed;
    margin-top: 80px;
    margin-left: 1020px;
    font-size: 18px;
    padding-top: 0px;
    padding-bottom: 17px;
    text-align: center;
    height: 420px;
    width: 300px;
    /*overflow: hidden;*/ <---- remove for "glitch" to go away
    color: #000000;
    -webkit-transition: opacity 0.3s linear;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    background-color: transparent;
    opacity: 1;
    z-index: 999;
}

要素は、検閲された (私が推測する) F ワードと名付けられています!

于 2013-05-15T21:03:56.530 に答える
0

CSS オーバーフロー プロパティが必要です: Overview。非表示または表示でうまくいくはずです。

于 2013-05-15T20:36:44.073 に答える