1

ユーザーがテキストを書き込んで、スクロールバーや非表示の代わりにオーバーフローすると、通常の Word ドキュメントなどのようにダウンする CSS を作成しようとしています。私はこのコードを持っています:

#content-text {
    width: 960px;
    padding-left: 10px;
    padding-right:10px;
    text-align: left;
    color:#000;
    height:100%;
    margin-left: 25px;
    margin-right:25px;
}

奇妙なことに、このコードは実際には Firefox の IE で必要なことを実行しますが、オーバーフローしてスクロールバーになります。オーバーフローを試しました：自動; オーバーフロー:非表示; およびオーバーフロー:継承; これまでのところ運が良かったのですが、正直なところ、Firefoxでなぜこれが起こっているのかわかりません=/誰か知っていますか?

更新:overflow:visible; で試しました。しかし、私はオーバーフローを取得します...よく見えますが、それでもラップしません。これまでのところ Firefox のみです。=/

更新:影響を与える可能性のある唯一の他のことは、別の CSS コードがあり、最初のコードが含まれていることです。

#content-title{
    background-color: transparent;
    background-image: url(../img/content-title-body.png);
    background-repeat: repeat-y;
    background-attachment: scroll;
    background-x-position: 0%;
    background-y-position: 0%;
    height:auto;
    position:absolute;
    z-index :100; /* ensure the content-title is on top of navigation area */
    width:1026px;/*1050px*/
    margin: 160px 100px 5px 100px;
    overflow: visible;
    top: 55px;
}

これを使用する HTML は次のとおりです。

<div id="content-title">
                <div id="content-text">             Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!Hola!<p>Hola!Hola!Hola!Hola!Hola!Hola!<p>Hola!Hola!Hola!Hola!<p>Hola!Hola!Hola!Hola!<p>Hola!Hola!Hola!<p>Hola!Hola!Hola!Hola!<p>Hola!Hola! 
        </div>
</div>
4

4 に答える 4

3

試してください: overflow: visible.

于 2009-01-06T00:51:38.200 に答える
3

したがって、あなたのcssはおそらく問題ありません。たとえば、私のページでは、css は次のようになっています。

 textarea.input_field2 {
    margin: 10px 10px 10px 0px;
    width: 440px;
    height: 150px;
    background:#696969; 
    color: white;
    border: none;
    font-size: 14px;
    text-align: left;
    vertical-align: middle;
    }

次に、本体で次のように呼び出します。

 <textarea rows="9" cols="9" class="input_field2" name="user_comments"></textarea>

それは正常に動作します。ただし、テストするときは、Lorem Ipsum のようなものでテストしてください。スペースを含む単語であり、'aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa' のような 1 つの長い文字列ではなく、スクロール バーが強制的に表示される可能性があります。また、html と css の検証も確認してください。

于 2009-01-06T01:18:43.667 に答える
0

あなたがここで示している以上のことが物語にあるに違いありません。提供された CSS を使用しましたが、Internet Explorer と Firefox の両方で同じ動作が見られます。ページは幅 960 ピクセルでレンダリングされ、ブラウザーの幅がこれよりも小さい場合、水平スクロール バーがレンダリングされます。

要素に幅を指定すると、ブラウザーはこの値よりも小さい要素をレンダリングしません。例から幅の宣言を削除すると、要素は必要な幅だけレンダリングされます。

これが探している答えでない場合は、全体像を示すためにさらにコードを提供してください。

于 2009-01-06T01:15:10.053 に答える