1

位置=絶対のdivのセットがあり、画面全体に配置できます。

divのコンテンツが画面に収まらない場合、ブラウザはテキストを複数行に折り返し、ウィンドウ内に収まろうとします。

しかし、私はブラウザにそうさせたくありません。代わりにコンテンツを非表示にする必要があります。

http://jsbin.com/welcome/35835/edit/

編集：

あなたはそれを絶対的なポジショニングを持つページ上のdivと考えるかもしれません。と

1）ユーザーはdivをドラッグできます

2）ユーザーはdivの幅を手動で変更できます（ユーザーが使用できるストレッチボックスウィジェットがあります）。

したがって、問題は、ユーザーが画面の端の近くでdivをドラッグしているときに、テキストがウィンドウの外に出ても折り返さずに非表示にする必要があることです。これがよりよく説明されることを願っています

例に示されているように、示されているブロック2は私が欲しいものです。

したがって、divの幅が100pxで、CSSスタイルの左側の位置が（画面幅-50）であるとすると、残りのテキストは非表示になります。

解決策1：空白：nowrap。これは柔軟な幅のUIであり、ユーザーが必要に応じてdivの幅を変更できるため、これを使用することはできません。

解決策2：divの幅を明示的に数値に設定すると、正常に機能します。

ただし、最適なソリューションではありません。ここでは、レンダリング時にすべてのdivの幅を常に計算する必要があります。

ブラウザがテキストを画面に合わせようとしないようにする、より最適な解決策はありますか。

4

4 に答える 4

2

あなたが何を求めているのか見分けるのは難しい。でも使えると思います

{
  height: 1.2em;
  overflow: hidden;
}

サポートしている1行より長いコンテンツを非表示にするには

http://jsfiddle.net/MXXDC/2/

于 2012-10-18T00:42:39.010 に答える
0

これはあなたが望むものですか？（2番目のアイテム）

内側のテキストを非常に長いdivでラップし、そのoverflow:hidden親に適用しました。

于 2012-10-18T00:34:53.113 に答える
0

それらをすべて巨大なものの中に入れると（たとえば、5k px * 5k pxの絶対位置のdiv）、期待される効果が表示されるはずです：http: //jsbin.com/welcome/35862/edit

于 2012-10-18T00:39:32.813 に答える
0

ウィジェットの正確な使用例がわからないため、ウィジェットが何を持っているのか、何を持っていないのかを100％確信していません。私は考えを持っています、多分それは役に立つでしょう-％に幅を設定することは役立つかもしれません、このようなもの

.block2{
    left: 50%;
    top: 100px;
    width: 100%;
}

jsでの計算を避けるために、これをcssで設定できますが、私が言ったように、これがどのように使用されるかわからないため、これは機能しない可能性がありますが、いくつかのアイデアが得られる可能性があります

于 2012-10-18T01:11:22.430 に答える