CSSを使ったデキ最低の２カラムサンプル

Ｒサイドの左端に罫線を挿入し、１文字分のパディングを付けて コンテンツがくっつかないようにしました。メインとＲサイドの width 合計は94%にしているのですが、実際は制御できていません。 ...つぅーか、ブラウザが違うと見え方が違うことが判明しました。 天地方向のパディングは ie では正しく解釈されず、 width はopera でのみ意図したように解釈されるようです。

aqua_btns
似てるけど実は仕様がまったく違うボタン

「似てるけど実は仕様がまったく違うボタン」では リンクアンカーをクラス分け しています。このケースではマウスのオンオフで表示が変わる画像の変化に合わせて リンク時、既訪問時、ホヴァリング時の色を設定しています。
a.btn:link {text-decoration: none; color: #ffff00;} a.btn:visited {text-decoration: none; color: #ffffff; } a.btn:hover{ text-decoration: none; color: #ff99cc; background-color: #555555; border-width:0px; border-style:inset; position:relative; top:-1px; left:0px; }
みたいな感じで。

デフォルトで設定しているリンクアンカーは、親ページの webcal template で使用したCSS を まんま流用しているので、リンク箇所が浮き出すような ここをクリック みたいなスタイルになっています。

右サイドスペース

ww

http://www.ne.jp/asahi/sun/3/1/allocation.html を XHTML1.0 Transitional としてチェックしました。
17個のエラーがありました。このHTMLは 91点です。タグが 22種類 44組使われています。
文字コードは Shift JIS のようです。
先頭の数字はエラーのおおまかな重要度を 0〜9 で示しています(減点数ではありません)。
少ない数字は軽く、9 になるほど致命的です。0 は減点対象外のごく軽度のエラーで (グレイのかっこつき) でメッセージされています。
XHTML1.0 では<style>〜</style> 内にコメントを書くと、本当にコメントとして扱われますが、外部シートを使うことで回避できるケースもあります。

Valid XHTML 1.0 Transitional Valid CSS!