えす＃０５５のブログ一覧

最近政治外交のネタばかりだったので、チョット一息いれました。

この画像を元に、切り貼りをして


こんな画像を作りました。で、先日の非公認の画像と入れ替えれば・・・

画像サイズを節約する為に、横方向にリピートをしています。ブラウザ幅を1300px以上にすると・・・、まあ気にしないということで。

先日こんな事を書きましたが、実は一番指摘して欲しかった点はナビゲーションバーの上部だったんですね。

こちらでは背景色が白ですが、

＜--こちらでは背景色が灰色です。そしてよーくみると単色ではなく、アルミニウムの背景画像が使ってあるんです。

で、今回は更に解りやすくする為、別の画像を貼り付けて、ついでに一寸だけハロウィン仕様にしました。で、ボディとユーザー領域でそれぞれ別の画像を設定したので、ヘッダーをコンテンツ領域に動かしました。そして、このコンテンツ領域は幅が930pxまでなので、結果としてヘッダーの幅が狭くなったと言う訳です。

タグの詳細は
ページbody-ハロウィンヘッダー画像を流用/大きい画像の一部を横方向にリピートさせて利用
color:#fff;
background-image:url(https://cdn.snsimg.carview.co.jp/cvmaterials/minkara/user/css/055/header.jpg);
background-position:50% -200px;
background-repeat:repeat-X;
background-color:#;
リンク-背景が画像になってしまうため色を変更、基本の設定が変わってしまうので、元の設定は「ユーザー領域リンクに移動」以下の訪問済み・マウスオーバーも同様
color:cyan;
リンク(訪問済み)
color:cyan;
リンク(マウスオーバー)
color:red;
background-color:#000;

ユーザー領域-アルミニウム背景
color:#222;
font-weight:normal;
background-image:url(https://cdn.snsimg.carview.co.jp/cvmaterials/minkara/user/css/037/background.gif);
background-attachment:fixed;
background-position:0px 50px;
ユーザー領域リンク
color:#222;
ユーザー領域リンク(訪問済み)
color:#222;
ユーザー領域リンク(マウスオーバー)
color:red;
background-color:transparent;

コンテンツ領域-パルサーヘッダー画像/元はユーザー領域で表示していた
background-image:url(https://cdn.snsimg.carview.co.jp/minkara/photo/000/001/701/441/1701441/p5.jpg);
background-repeat:no-repeat;
background-position:0 0;

ヘッダー画像を差し替えて、ついでにタブの下へ移動しました。
相変わらず広告が被っていますが、このレイアウトならホイールが隠れません。
もっとヘッダーを下げれば完全に広告を回避できますが、今度はサイドメニューと重なります。

写真を撮るときに最初から構図を考えておけば良いって突っ込みは無しの方向で。

とは言え、こんな独り言ブログにコメントを入れる方など殆どいないんでしょうが。（苦笑）お友達でも幅広の方は少ないし。

先ほど、スタイルシートを色々弄っていて、一通り終わった後にコメントを頂きました。

「ＰＣからコメント入れられませんが…

携帯は入る様です。」

との事・・・心当たりは有り過ぎて・・・で、冷勢冷静になって考えてみると、

今回の変更点の1つ「コンテンツ幅を30ｐｘ広げた」ことに有ると思い、少々修正をしました。実際にコメントが
入るまでは治ったか否か解りませんが、多分大丈夫でしょう。

で修正した場所は
「コメントする」表示（div#MoveCommentForm）にwidth:600px;の一行を追加しました。

要は、「コメントする」がコンテンツ領域から完全にはみ出していた事が原因のようです。ここのブログの最後でも確認できますが、「スタイルシート弄り」のリンクで「スタイ」までならリンクが赤くなりますが、「ルシート弄り」の部分ではリンクが反応せず、クリックする事が出来ません。つまり、一部でもはみ出していなければ、その部分をクリックする事が出来るという事です。

それともう1つ面白いのは、サイドメニューの下端よりも下にあるブログの場合は、リンクやボタンが領域の横幅に影響されず普通にクリックできるようです。最もブログの「コメントする」はブログ単独の表示にしか出てこないので、影響が大きいですが、常にサイドメニューよりも長いブログを書く方には全く関係が無いようです。

コンテンツ幅を広げている方でも、コメント欄の幅を広げていなければ「コメントする」の位置も標準のままで、クリックできなくなる事は無いので心配ありません。多分。
むしろコメント関係は弄らない方が無難かも。（＾-＾*；；

追記/ＩＥ8の場合「スタイルシート弄り」の何処でもクリック出来ますね。って事はＦｉｒｅｆｏｘ特有の現象なのかな？ブラウザによって反応が違うってのは・・・
ま、仕方ないな。

たまにはシンプルにしようかなと思って、黒ベースと白ベースの幅広を作りましたが、「白ベース」を作っている最中に、そういえばALUMINIUMってスタイルがこんな感じだったようなことを思い出して、ALUMINIUMを基にして再度編集してみました。

ヘッダーが少々シンプルではなくなりましたが、これはこれで良い感じです。自画自賛；；また暫くしたら飽きて、色々画像を貼り付けそうな気はしますが、雛形って事で。

コンテンツ幅は一応730ｐｘですが、はみ出た部分も表示されるので・・・
730だと

920だと

1024だと

こんな感じですね。そういえば、携帯からは見えないんだったかな。