人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

width:300pxなど横幅を指定したブロック要素内に「aaaaaaaaaaaaaa」など半角英数字を長く入力して指定した横幅より長くなると、文字がみ出してしまいます。
これを回避する方法はありますか?
ただし、word-wrap、wrod-break以外の方法でお願いします。

●質問者: ドム
●カテゴリ:ウェブ制作
✍キーワード:Word ブロック 入力 回避 数字
○ 状態 :終了
└ 回答数 : 4/4件

▽最新の回答へ

1 ● ngc02
●25ポイント

ご希望に添えるような方法ではないと思いますが

この方法しかありません


overflowを設定すると、スクロールバーが表示されたり表示しなくなったりします。

http://www.htmq.com/style/overflow.shtml

overflow-スタイルシートリファレンス

◎質問者からの返答

なるほど、そういう回避策もありますね。ありがとうございます。


2 ● satanii
●25ポイント

http://d.hatena.ne.jp/

はてなダイアリー - キーワードでつながる多機能ブログ

overflowプロパティを指定することで可能です。


はみ出した部分を非表示にする場合のキーワードはhidden、スクロールバーをいつもつける場合にはscroll、はみ出したときにスクロールバーをつける場合にはautoを指定してやります。


例;

<div style=”OVERFLOW: hidden; WIDTH: 300px; HEIGHT: 50px”>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>


ブラウザーによって見え方が違う可能性もあるので環境を変えてチェックしてみて下さい。ちなみに私の環境ではheightを指定しないと表示が乱れる場合がありました。

◎質問者からの返答

上の回答と同じですね。やはりそういう回避策しかないですかね。

ありがとうございます。


3 ● satanii
●25ポイント

別の方法を考えてみましたがいかがでしょうか。


(例)

<table height=”50” width=”200” style=”TABLE-LAYOUT: fixed”><tr><td>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td></tr></table>

◎質問者からの返答

tableレイアウトですか。最終手段なきがします。ありがとうございます。


4 ● tenman
●25ポイント

web標準でなくてもよければ、以下の挙動を確認して見てください。


IEでは動作します。 ファイヤフォックス動作しません


<nobr>

<wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr><wbr>b</wbr>

</nobr>


<p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>

◎質問者からの返答

なるほどー。激しいやり方ですね。IEだけだとword-wrapでよいきがします。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ