HTMLについて質問します。


テーブルをくんでいるのですが、その上でwidth="100"などして固定しています。
しかし、縦幅は固定していません。

全角文字は横幅が固定されて縦がのびていい感じなのですが、半角英字などは横幅が固定されず、そのままのびてしまいます。

なにか良い方法はないでしょうか?

回答の条件
  • URL必須
  • 1人20回まで
  • 登録:2007/09/20 23:18:01
  • 終了:2007/09/27 23:22:04

回答(5件)

id:steel-plate No.1

steel-plate回答回数3ベストアンサー獲得回数02007/09/20 23:56:06

ポイント20pt

htmlでは半角英数字が連続するとそれは単語とみなされてしまいます。また、htmlでは単語の途中で改行を入れることは行いませんので、いくらwidth属性で幅を規定していても改行されずに広がってしまうというわけです。


これをhtmlで回避する方法は残念ながらないようです。


cssではword-breakでbreak-allを指定することで、改行されるようになるようですが、これはIEのみの使用のようで他のブラウザでは動かないようです。以下のように記述するとIEでは改行されます。

>|html|

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

||<

また、自動ではなく改行する場所がわかっているのであれば、<wbr>というタグがありますので、これで改行することも可能です。以下のソースでは<wbr>が入っている場所で幅が規定値を超えていた場合は改行されます。

>|html|

aaaaaaaaaaaaaaaa<wbr>aaaaaaaaaaaaa<wbr>aaaaaaaaaaaaaaaaa<wbr>aaaaaaa

||<

IEに限定してしまうのであればCSSでの記述もありですが、そのようなつくりはあまり好まれませんので、半角英数字を使わないように変更するのが無難でしょう


word-break−スタイルシートリファレンス

<wbr> - 単語の区切り

id:zachouR

なるほど、同一単語とみなすのですね。

途中で<wbr>は入れることができません。

うーん、どうしよう。

2007/09/21 09:18:38
id:pmakino No.2

まきのっぴ回答回数352ベストアンサー獲得回数282007/09/21 00:02:04

ポイント20pt

word-wrap: break-word; を指定します。

http://www.htmq.com/style/word-wrap.shtml

ただしこれが有効に働くのは Internet Explorer のみです。

id:zachouR

これはいいですね!

しかし、Firefoxでは動かないんですね。

なにか、よい方法はないかな、、、。

2007/09/21 09:19:10
id:sagamihara-jiro No.3

sagamihara-jiro回答回数28ベストアンサー獲得回数32007/09/21 00:03:24

ポイント20pt

英字が改行されずに横に続くという意味でしょうか。

英語などが単語の途中で別れてしまわないように、一続きの半角文字は途中で改行されないようになっています。スペースを挟んでください。

http://q.hatena.ne.jp/

id:zachouR

半角はある事情で入れることができません。

すいません。

2007/09/21 09:20:38
id:wizemperor No.4

wizemperor回答回数379ベストアンサー獲得回数522007/09/21 00:06:22

ポイント20pt
<table width="100px" style="word-break:break-all; word-wrap: break-word;">

とすればいけます。ただしIE限定です。

Firefoxなどでは半角英数字が連続すると折り返されませんので、文字の間に半角スペースをいれるか、

<table style="word-break:break-all; word-wrap: break-word; width: 100px; overflow: auto;">

のようにスクロールテーブルにすれば解決すると思います。

http://q.hatena.ne.jp/answer

id:zachouR

うまくいきました!

ありがとうございます。

僕はAdobe GoLiveで組んでいるのですが、プレビューの状態ではうまく作動しないようです。

しかし、実際にブラウザでみてみるときちんと動作していました。

2007/09/21 09:50:33
id:Marine-Blue No.5

Marine-Blue回答回数237ベストアンサー獲得回数122007/09/21 10:13:35

ポイント20pt

JavaScriptを埋め込むという方法もあるようです。下のソースを書き換えずに住むので楽チンですよ。

http://www.koikikukan.com/archives/2005/08/04-235647.php


あとついでに言っとくとOperaはCtrl+F11で強制折り返しが利きます。

id:zachouR

ありがとうございます。

Ctrl+F11 試してみますね。

しかし、どうして半角だとどこまでもいく設定なのでしょう。

個人的に不便だと思うのですが、、、。

2007/09/21 19:58:20
  • id:sagamihara-jiro
    sagamihara-jiro 2007/09/24 05:28:15
    アルファベット圏で作られた規格ですからね。単語の途中で折り返されると別の単語になってしまいます。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません