自由記入欄やフリーページにHTMLタグを記載したところページのレイアウトが崩れました

2007-08-17 16:37
記載いただているHTMLタグを一度ご確認下さい。

●確認するポイント

(1)タグが正しく閉じられているか
下記のように、「>」や「"」の記載が抜けているとレイアウト崩れの原因となりますので、ご確認下さい。

例1) >の記載漏れ
<font color="#FFFFFF"  正しくは→ <font color="#FFFFFF">

<a href="https://demo.ocnk.net/"
  正しくは→ <a href="https://demo.ocnk.net/">

例2) "の記載漏れ
<font size="5>  正しくは→ <font size="5">

<a href="https://demo.ocnk.net/>
  正しくは→ <a href="https://demo.ocnk.net/">


(2)開始タグに対する終了タグが抜けていないか
下記のように、</td></tr></table>等の記載が抜けているとレイアウト崩れの原因となりますので、ご確認下さい。

例1) </td></tr></table>の記載漏れ
<table><tr><td>内容  正しくは→  <table><tr><td>内容</td></tr></table>

例2) </center>の記載漏れ
<center>内容  正しくは→  <center>内容</center>

例3) </a>の記載漏れ
<a href="https://demo.ocnk.net/">内容  正しくは→  <a href="https://demo.ocnk.net/">内容</a>

(3)tableタグやimgタグの横幅が大きすぎないか。
下記ように<table>タグや<img>タグに1000や1500等の大きな数値を指定している場合、横にはみ出して表示されますので、数値を小さくして下さい。

例1) <table>タグの横幅が1000や1500などの大きな数値になっている場合、横幅がはみ出します。
<table width="1000" ><tr><td>内容</td></tr></table>

例2) <img>タグの横幅が1000や1500などの大きな数値になっている場合、横幅がはみ出します。
<img src="https://demo.ocnk.net/data/demo/image/demo.jpg" width="1000" />

(4)imgタグに横幅の指定をしているか
下記ように<img>タグの横幅を指定していない場合、元画像の大きさで表示されます。その際、元画像の横幅が大きすぎる場合、横にはみ出して表示されますので、横幅を指定していただくか、画像の横幅を編集して下さい。

例1) <img>タグの横幅指定をしていない
<img src="https://demo.ocnk.net/data/demo/image/demo.jpg" />
↓変更後
<img src="https://demo.ocnk.net/data/demo/image/demo.jpg" width="450" />