人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

Bloggerにて、Blogを公開しているのですが、外国のテンプレートをどうしても使用したく、とりいれたのです。
ところが、ヘッダー部分が、どうしても画面サイズに合いません.HTML言語を、いじりまくったのですが、なおりません。
きちんと表示するよう、改善したいのですが教えてください。
ブログアドレスです。
http://kennkennchikuchiku.blogspot.com/

●質問者: kazzzz
●カテゴリ:ウェブ制作
✍キーワード:blog BLOGGER HTML アドレス テンプレート
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● gillsderais
●27ポイント

私もBlogger使ってます。お互いがんばりましょう^^。

さてさて、そんな前置きは置いといて、


>ヘッダー部分が、どうしても画面サイズに合いません。


とは、具体的にどのことを指していますか?もう少し説明くださると助かります。


・もし、ヘッダーの背景画像をBodyの背景の横幅に合わせたいのであれば、「#blog-header div」のWidthを800pxにすればよいと思います。

・また、ヘッダーを画面いっぱいに広げたいのであれば、「#wrapper」と「#blog-header div」のWidthを削除すればよいと思います。

上記に2つの回答は、勝手に質問を解釈して回答しております。ので、試される前に質問内容の詳しい説明をお願いします(または、参考にされたブログのURLでもかまいません)。


URLはダミーです。http://www.blogger.com/start

◎質問者からの返答

説明不足で申し訳ありません。

下記のサイトより、ダウンロードしたテンプレートを,自分なりに貼付けてみたのですが,ブラウザの表示画面を拡大縮小すると,上部の画像テンプレート部分が,それに追従してこなくなり,下部分と分かれて表示されてしまいます。

http://blogspottemplates.blogspot.com/

文章表現力が足りなくてすみません。

ブログのURLを、下記に示します。↓

http://kennkennchikuchiku.blogspot.com/

以上よろしくお願いいたします。


2 ● hamster009
●27ポイント

ページに直接cssを書き込んでるみたいですけど、ここに

http://tools.kuribo.info/bloglendar/bloglendar.css

元のcssがあるので、これを参考に数字などを書き換えてください。

◎質問者からの返答

回答ありがとうございます.


3 ● gillsderais
●26ポイント

テンプレートの/* globalから#blog-header div {・・・}までの部分を以下のものに置き換えてください(確認済み)。

http://presto-test-test.blogspot.com/(今日中に削除しますが・・・^^;)

とりあえず応急処置的なものですが、理想には近づくと思います。

(ちゃんとやればもう少しうまくいくかもしれません・・・)


/* global----------------------------------------------- */

body {

margin: 0;

padding: 0;

font-size: 12px;

background: #ce436e ;

font-family: helvetica, arial, verdana, "trebuchet ms", sans-serif;

color: #632035;

}

blockquote {

margin: 0;

padding: 0 10px 0 10px;

border-left: 6px solid #f7d8e2;

border-right: 6px solid #f7d8e2;

color: #ba476b;

}

code {

color: #ba8094;

}

hr {

display: none;

}


/* layout----------------------------------------------- */

#wrapper {

margin: 0 auto;

background: #ce436e url(http://photos1.blogger.com/blogger/2147/3667/1600/sp_bg.jpg ) repeat-y center 175px ;

width: 800px;

height:100%;

text-align: left;

}

#blog-header {

padding-bottom: 15px;

}

#blog-header div {

width:800px;

height:175px;

background: url(http://photos1.blogger.com/blogger/2147/3667/1600/sp_header.jpg) no-repeat center 0px;

}

何か不都合ありましたらご連絡下さい。

(その際、下のコメントを書き込めるようにしていただけると助かります)

◎質問者からの返答

何度も,丁寧な回答本当にありがとうございました。

上記にあるように,貼付けたところ,無事なおりました。

最近、人とのコミュニケーションが、煩わしく感じることが多く,gillsderais さんの、親切な回答に,年甲斐もなく感激いたしました。

今後も機会がございましたら、よろしくおねがいいたします。

それでは、失礼いたします。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ