スポンサーサイト 

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。


テンプレート部門に参加中。クリックしてくださると励みになります♪
--:--  |  スポンサー広告  |  EDIT  |  Top↑
2007.09/15 (Sat)

IEの強制改行タグについて 

ひー、do_onpu2cの記事にいただいたご質問に、レスを書いたら、覚えのない禁止ワードに触れているとか出て、コメント出来ないよう><;
ということで、すみませんが、Luckさん、こちらでお返事しますねー(;´▽`A``

テンプレ気に入ってくださって、嬉しいです(^▽^)

私がサイズに合わせて改行するテキストエリア以外でも、長い半角英数字(ソース)を書くことが多いので、IEで強制改行させるタグを入れてるせいかと……。
スタイルシートの上の方を見てください。

/* 初期化 */
* {
margin:0;
padding:0;
word-break:break-all;
}


赤字の部分が、IEで半角英数字を強制改行させるというタグなんです。
なぜこんなものを入れているのかといいますと、IE7とたいていのモダンブラウザであれば、長い半角英数字(記号も)が続いていて(URLなんかが典型)、改行しなかった時でも、文字はカラムをはみ出すだけで済むんですが、IE6以下だと、カラムを拡張し(カラム幅より大きな画像を貼った時と同じ現象です)、レイアウトを崩れさせてまう(いわゆる「カラム落ち」)を起こすので、その防止策なんです。

スタイルシートからword-break:break-allを消してしまえば、お望み通り、強制改行しなくなりますが、IE6ユーザーも多い(まだ一番多いのかな?)ので、その人たちが見ると、レイアウトが崩れていることもあるので、取ってしまうのは危険なんです。

各ブラウザでどんな風に見えるかは、下記サイトさんを参考にしてください。
http://blog-imgs-29.fc2.com/p/i/n/pinotan/word-break.html

でも、勝手に改行されるのは見栄えが悪いので、強制改行タグは使いたくない……という場合は、半角英数字が長く続く時には、ところどころ手動で改行を入れれば、レイアウト崩れの防止になりますので、注意しながら使ってくださいねー。
ただし、コメントやトラバにやたら長いURL(連続した長い半角英数字)を入れられた場合は、危険ですが、まああんまりないですよね?

(ちなみにはみ出した部分を隠すoverflow:hiddenを本文部分に指定するのは、自分で書いた英数字が中途で見えなくなることがありますので、私やLuckさんみたいなケースにはむきません;)
スポンサーサイト


テンプレート部門に参加中。クリックしてくださると励みになります♪
17:52  |  レス  |  TB(1)  |  CM(0)  |  EDIT  |  Top↑

do_onpu_2cが登録されました♪ 

do_onpu_2cが登録されました♪
画像クリックで見本
dokode_do_onpu_2c.gif
トップバナーの写真はクリエィティブコモンズライセンス(ものによって色々、種類あります)の条件下で、自由に使える、海外の写真投稿サイトmorguefileよりお借りしたものを加工しました♪

今回、登録早かったなー
夏休み中は申請してから登録されるまで10日以上かかっていたようですが、今回は半分の日数でした♪
前に戻っただけなんですが(もっと前は、中3日くらいで登録されてたけど)、個人的にはこのくらいがちょうどいいかな♪

このテンプレに合わせて作った没壁紙がうなっているので; その中からいくつかUP……。
使いたい方は、スタイルシートの以下の部分を探し、太字部分のURLを書き換えてください。

body {
text-align:center; /* 中央に配置 */
color:#300; /* 画面全体の文字色 */
font-family:"\FF2D\FF33\20\FF30\30B4\30B7\30C3\30AF","\30D2\30E9\30AE\30CE\20Pro\20W3",'Hiragino Kaku Gothic Pro','Osaka',sans-serif; /* 画面全体のフォント指定 */
font-size:12px; /* 画面全体の文字サイズ */
background:url(http://blog-imgs-14.fc2.com/d/o/k/dokode/kabedobr1.jpg); /* 背景画面のアドレス */
background-color:#D2B48C; /* 画面背景の色 */
padding:0;
margin:0;
}



似たような感じでやや荒めのテクスチャ
http://blog-imgs-14.fc2.com/d/o/k/dokode/kabedobr2.jpg


赤系のテクスチャ(メニューの土台と同じにしたかったのに、途中経過のデータを保存していなかったので作れず……若干違います;)
http://blog-imgs-14.fc2.com/d/o/k/dokode/kabedored1.jpg


シンプルな音符模様
http://blog-imgs-14.fc2.com/d/o/k/dokode/kabeonpubr.gif


シンプルな水玉
http://blog-imgs-14.fc2.com/d/o/k/dokode/dodotbr.gif


赤茶系のストライプ
http://blog-imgs-14.fc2.com/d/o/k/dokode/kabedobll1.gif


ブラウン系チェック
http://blog-imgs-14.fc2.com/d/o/k/dokode/kabedotc3.jpg


私のテンプレに使う分には直リンクOKですが、他のことには使わないでくださいね。

何かこのテンプレに対してご質問やご感想等ありましたら、この記事にコメントでお願いします♪

【Read More・・・】



テンプレート部門に参加中。クリックしてくださると励みになります♪
01:11  |  テンプレートUP情報  |  TB(3)  |  CM(58)  |  EDIT  |  Top↑
 | HOME | 
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。