タグ付けされた質問 「positioning」

コンテンツのブロックの下にあるdivを作成したいのですが、ページがその上部境界に接触するのに十分なだけスクロールされると、所定の位置に固定され、ページと共にスクロールします。

305 javascript  jquery  css  scroll  positioning 

CSSはDivをページの下部にプッシュします そのリンクを見てください、私は反対が欲しいです：コンテンツがスクロールバーにオーバーフローするとき、私はフッターが常にスタックオーバーフローのようにページの完全な下部にあることを望みます。 私はdiv id="footer"とこのCSS を持っています： #footer { position: absolute; bottom: 30px; width: 100%; } ただし、ビューポートの下部に移動するだけで、下にスクロールしてもそのまま表示されるため、下部に表示されなくなります。 画像： 明確にされていない場合は申し訳ありませんが、私はそれがすべてのコンテンツの実際の下部にあるためにのみ修正されることを望んでいません。

261 css  positioning  css-position  footer 

divの中央に配置しようとしているSVGがあります。divの幅は900pxです。SVGの幅は400pxです。SVGのマージン左とマージン右は自動に設定されています。機能しません。左マージンが0（デフォルト）であるかのように機能します。 誰かが私のエラーを知っていますか？

254 css  layout  svg  positioning  margin 

HTMLとCSSを使用して、水平100％積み上げ棒グラフを作成しようとしています。DIVsグラフ化する値に応じて、背景色とパーセンテージ幅を使用してバーを作成したいと思います。また、グラフに沿った任意の位置をマークするグリッド線も必要です。 私の実験では、CSSプロパティを割り当てることにより、バーを水平に積み重ねていますfloat: left。しかし、混乱を招くようにレイアウトを混乱させているように思われるため、これは避けたいと思います。また、バーをフロートさせると、グリッド線がうまく機能しないようです。 CSSポジショニングはこれを処理できるはずだと思いますが、それを行う方法はまだわかりません。コンテナの左上隅を基準にして、いくつかの要素の位置を指定できるようにしたいと思います。私はこの種の問題に定期的に（この特定のグラフプロジェクトの外でも）遭遇するので、次のような方法が欲しいです。 クロスブラウザ（理想的にはあまり多くのブラウザハックなし） Quirksモードで実行します カスタマイズを容易にするために、可能な限り明確/クリーン 可能であればJavaScriptなしで実行されます。

187 html  css  positioning 

要素を相対的に配置して、ドキュメントフローのスペースを占有しないようにするにはどうすればよいですか？

186 html  css  positioning  css-position 

違いは何であるposition()とはoffset()？クリックイベントで次のことを実行しようとしました。 console.info($(this).position(), $(this).offset()); そして、それらはまったく同じように返すようです...（クリックされた要素は、テーブルのテーブルセル内にあります）

178 jquery  positioning 

-webkit-transform（および-moz-transform / -o-transform）を使用してdivを回転させています。また、divがユーザーと共にスクロールダウンするように、位置が固定されています。 Firefoxでは正常に動作しますが、Webkitベースのブラウザでは機能しません。-webkit-transformを使用すると、固定位置が機能しなくなります。そんなことがあるものか？

155 html  css  positioning  rotation 

ホバー時にCSSトランジションエフェクトがdivを移動するCSSがあります。 この例でわかるように、translateトランジションには、div内の画像を1px右/下に移動させる（そして、サイズを少しだけ変更する可能性があります）という、ひどい副作用があり、場違いに見えて、焦点が合っていない... グリッチはホバー効果が適用されている間ずっと適用されているようであり、試行錯誤のプロセスから、私は安全に、トランジショントランジションがdivを移動するときにのみ発生するように見える（ボックスの影と不透明度も適用されますが、違いはありません）削除時のエラー）。 この問題は、ページにスクロールバーがある場合にのみ発生するようです。したがって、divのインスタンスが1つしかない例でも問題ありませんが、同じdivが追加され、ページにスクロールバーが必要になるため、問題が再び発生します...

150 css  image  hover  positioning  translate-animation 

.offset([coordinates])メソッドは要素の座標を設定しますが、ドキュメントに対してのみです。次に、要素の座標を親に対して相対的に設定するにはどうすればよいですか？ 見つけた .position()メソッドは、親に相対的な「上、左」の値のみを取得する、値は設定されていません。 私が試した $("#mydiv").css({top: 200, left: 200}); しかし動作しません。

144 jquery  css  jquery-selectors  positioning  css-position 

たとえば、いくつかのクラス.articleがあり、このクラスをグリッドビューとして表示したいとします。だから私はこのスタイルを適用しました： .article{ width:100px; height:100px; background:#333; float:left; margin:5px; } そのスタイルは、.articleをタイル/グリッドのように見せます。高さを固定しても問題ありません。しかし、高さを自動に設定したい場合（その中のデータに応じて自動的に拡大する）、グリッドは見苦しく見えます。 そして、私はこのようなビューを作りたいです：

129 css  grid  positioning  css-float  tiles 

私はこのスレッドを見つけました— 画像の縦横比を維持しながら、どのようにして画像をストレッチして<div>を埋めますか？—それは完全に私が欲しいものではありません。 特定のサイズのdivとその中に画像があります。画像が横向きか縦向きかに関係なく、常に divに画像を入力したい。また、画像が切り取られていても問題ありません（div自体にオーバーフローが隠されています）。 画像がポートレートであるので、もし私がしたいwidthこと100%とheight:auto、それは割合にとどまるようにします。画像が横長の場合は私がしたいheightことを100%してwidth to beauto`。複雑に聞こえますか？ <div class="container"> <img src="some-image.jpg" alt="Could be portrait or landscape"/> </div> どうすればいいのかわからないので、私が何を言っているのかを簡単にイメージしました。私もそれを適切に説明することはできません。 だから、私はこれを尋ねる最初のものではないと思います。しかし、私は本当にこれに対する解決策を見つけることができませんでした。たぶん、これを行うための新しいCSS3の方法があるかもしれません-フレックスボックスを考えています。何か案が？多分それは私が思っているよりももっと簡単ですか？

120 image  css  positioning  flexbox 

私はposition：fixedの要素を持っているので、ページと一緒にスクロールします。ユーザーが上にスクロールしたとき、要素のスクロールを特定のポイントで停止させたい場合、たとえば、ページの上部から250pxになったら、これは可能ですか？何か助けやアドバイスがあれば助かります。 そのためにはjqueryを使用する必要があると感じました。ユーザーがいる場所のスクロールまたは場所を取得しようとしましたが、本当に混乱しました、jqueryソリューションはありますか？

94 jquery  css  positioning 

CSSでは、静的（デフォルト）配置と相対配置の違いは何ですか？

89 css  static  positioning  css-position