【いるか賞の方に500P差し上げます。】


FC2ブログのテンプレートを加工したいのですが、
スタイルシート(必要であればHTMLファイルも)をどのように、修正すればよいか教えていただけると
助かります。

テンプレート名:sea_simple_seo_v2
テンプレートを利用しているブログ:http://goodman777.blog24.fc2.com/

cssファイル
http://blog-imgs-46.fc2.com/g/o/o/goodman777/csssample.txt

htmlファイル
http://blog-imgs-46.fc2.com/g/o/o/goodman777/htmlsample.txt

[加工したい箇所]
1,左サイドのカラム=幅325px
2,右サイドのカラム=幅325px
3,中央のカラム=幅412px
4,ヘッダーの下に、幅1162px(ブログの左枠~右枠まで)縦70pxの メニューを入れるスペース。

どうぞよろしくお願いいたします。

回答の条件
  • 1人2回まで
  • 13歳以上
  • 登録:2010/12/24 18:20:52
  • 終了:2010/12/31 18:25:02

回答(3件)

id:asuka645 No.1

あすか回答回数856ベストアンサー獲得回数972010/12/24 18:50:50

ポイント27pt

1,左サイドのカラム=幅325px

2,右サイドのカラム=幅325px

3,中央のカラム=幅412px

CSSを以下のように変更してください。

@charset "EUC-JP";

/*Sea_Simple_Seo_v2
---------------------------------------------------------*/

/*色変更-色を変える時は、ここを変えればだいたいOKです。
---------------------------------------------------------*/
#blogtitle a{
	color : #0066CC; /*ブログのタイトル色*/
}

.color_mainframe{
	border-left : 4px solid #0066CC; /*枠の色 左*/
	border-right : 4px solid #0066CC; /*枠の色 右*/
}

.color_topframe{
	border-bottom : 2px solid #0066CC;
}

.color_sidetitle{
		color: #FFF; /*サイドバーの文字色*/
}

.color_sidebar{
	background-color: #0066CC; /*サイドバーの背景色*/
}

.color_entrybg{
	background-color: #F5F5F5; /*エントリーの背景色*/
}

.color_entrytitle{
	background-color: #0066CC; /*エントリータイトル色*/
	color: #FFF; /*エントリータイトルの文字色*/
}

.color_entrytext{
	color: #333; /*エントリー本文の文字色*/
}


/*全体
---------------------------------------------------------*/
*{
	margin: 0px;
	padding: 0px;
	font-size :100%;
	font-style :normal;
	font-family: "Lucida Grande","Verdana", "ヒラギノ角ゴ Pro W3", "MS ゴシック", "Osaka‐等幅";
}

body{
	margin: 0px;
	padding: 0px;
	background-color: #FFF;
	text-align: center;
}

#container {
	width: 1062px;
	margin-right: auto;
	margin-left: auto;
	font-size: 13px;
	line-height: 140%;
	background-color: #FFF;
}

#wrap{
	width: 1062px;
	margin:0px;
}

#box2 {
	width: 660px;
	text-align: left;
	float : left;
}
#left {
	float : left;
	width : 325px;
	overflow: hidden;
}

#right {
	float : left;
	width : 325px;
	overflow:hidden
}

#main {
	padding: 15px 0px;
	float: right;
	width: 412px;
	overflow: hidden;
}

#mainbox {
	margin: 0px auto;
	width: 412px;
}

/*ヘッダ
---------------------------------------------------------*/
#header {
	text-align: left;
	width:1062px;
	height : 110px;
}

#header a{
	text-decoration: none;
}

#header a:hover{
	text-decoration: underline;
}

#blogtitle {
	font-weight : bold;
	padding : 10px;
	margin : 0px;
	font-size : 20px;
}

.introduction {
	width: 550px;
	font-size: 12px;
	font-weight: normal;
	line-height: 16px;
	padding-top: 8px;
	padding-left: 10px;
}

a { color: #483D8B; text-decoration : underline; }
a:hover { color: #FF4500; text-decoration : underline; }
a:link { color: #483D8B; text-decoration : underline; }
a:visited { color: #483D8B; text-decoration : underline; }
a:active { color: #483D8B; text-decoration : underline; }

/*一般再定義
---------------------------------------------------------*/
img{
	border:0px;
}

i{
	font-style: italic;
}

blockquote {
	margin: 5px;
	background-color: #FFF;
	padding: 5px;
	border-top: 1px dotted #0066CC;
	border-right: 1px dotted #0066CC;
	border-bottom: 1px dotted #0066CC;
	border-left: 1px dotted #0066CC;
}


pre {
	margin: 5px;
	background-color: #FFF;
	padding: 5px;
}

table{
	margin: 10px 0px;
}

/*クラス
---------------------------------------------------------*/
.emoji{
	margin: 0px 1px;
	vertical-align: middle;
}

/*エントリー
--------------------------------------------------*/

/*エントリー部------------------------------------*/
h2{
	border-bottom: 1px solid Black;
	border-right: 1px solid Black;
	font-size: 15px;
	text-align: left;
	font-weight: bold;
	padding: 3px 5px 3px 5px;
}

.entry h2 a:link   { color : #FFF; text-decoration : none; }
.entry h2 a:visited{ color : #FFF; text-decoration : none; }
.entry h2 a:hover  { color : #FFF; text-decoration : none; }
.entry h2 a:active { color : #FFF; text-decoration : none; }


.entry{
	width:490px;
	margin: 0px auto;
	text-align: center;
}

.entrybox{
	margin: 0px auto;
	width: 468px;
	text-align: left;
}

.entry a:link   { color : #0000FF; text-decoration : underline; }
.entry a:visited{ color : #0000FF; text-decoration : underline; }
.entry a:hover  { color : #0000FF; text-decoration : underline; }
.entry a:active { color : #0000FF; text-decoration : underline; }

.date {
	color: #0066CC;
	font-family: 'Trebuchet MS', Verdana, sans-serif;
	font-size: 10px;
	text-align: right;
	font-weight: bold;
	margin-bottom: 2px;
}

.entry p{

	margin: 17px 0px;
}

.entry h3{
	font-size:11px;
	margin: 14px 15px;
}

.entry span{
	line-height: 140%;
}

.entry ul,.entry ol {
	margin : 14px 0px;
}

.entry li {
	list-style-type: none;
	margin-left :0px;
}

.entry dl{
	margin : 14px 0px;
}

/*エントリーフッタ------------------------------*/
.posted {
	color: #0066CC;
	font-family: 'Trebuchet MS', Verdana, sans-serif;
	font-size: 12px;
	border-top: 1px dotted #0066CC;
	text-align: right;
	line-height: normal;
	margin-bottom: 18px;
}

.posted a {color: #666666; text-decoration: none;}
.posted a:link   { color: #666666; text-decoration: none;}
.posted a:visited{ color: #666666; text-decoration: none;}
.posted a:hover  { color: #666666; text-decoration: underline;}
.posted a:active { color: #666666; text-decoration: none;}

.bottom{
	text-align: left;
	margin: 10px;
}

.commment{
	color: #000;
	font-size: 15px;
	padding-bottom: 2px;
	border-bottom: 1px solid #472E12;
	text-align: left;
	font-weight: bold;
}

.commment a {text-decoration: none;}

.commenttext{
	width: 430px;
	margin: 6px 0px 6px 40px;
	font-size: 11px;
	color: #333;
	line-height: 140%;
}

#comment_edit{
	text-align: left;
}

.tbtext{
	margin: 5px 0px 5px 100px;
	font-size: 10px;
	color: #0066CC;
	line-height: 140%;
}

.tburl input{
	width: 100%;
	font-size: 11px;
}

.tbtitle{
	font-size: 11px;
}

.entry_navi{
	width:490px;
	color: #333;
	margin: 0px auto;
	text-align: center;
}

.entry_navi a{
	font-size:12px;
	font-weight:bold;
}

/*検索
----------------------------------------------------------*/
#search{
	margin-top:10px;
}

/* 自己紹介部分の画像
--------------------------------------------------*/
.prof{
	text-align: center;
}

.prof img{
	margin: 5px 0px;
} 

.proftext{
	margin: 0px 5px;
	text-align: left;
}

/* 左右サイドバー
------------------------------------------------------------*/
.side {
	padding: 15px 5px 15px 5px;
	font-size: 10px;
}

.sidetitle {
	border-bottom: 1px solid Black;
	border-right: 1px solid Black;
	font-size: 12px;
	text-align: left;
	font-weight: bold;
	padding: 3px 5px 3px 5px;
	margin-top: 0px;
	margin-bottom: 5px;
}

.side ul {
        padding: 0px;
        margin : 0px 0px 10px 0px;
}

.side li {
	margin:3px 0px 0px 3px;
	list-style-type: none;
	text-align: left;
	font-size: 10px;
	color:#000;
	line-height: 15px;
}

/*フッタ
---------------------------------------------------------*/
#footer {
	clear: both;
	width: 1062px;
	height: 70px;
	font-size: 12px;
	color: #063050;
	text-align: center;
	padding:10px 0px 0px 0px;
	border-top: 1px dotted #0066CC;
}

#footer a {
	text-decoration: underline;
}

#footer a:hover {
	color: #0066CC;
}

/*汎用
---------------------------------------------------------*/
.center{
	text-align:center;
}
.right{
	text-align:right;
}
.left{
	text-align:left;
}

4,ヘッダーの下に、幅1162px(ブログの左枠~右枠まで)縦70pxの メニューを入れるスペース。

HTMLのヘッダ部分を下記のように変更してください。

<!--ヘッダ開始-->
<div class="color_topframe" id="header">
<h1 class="introduction">日々のメモ</h1>
<p id="blogtitle"><a href="http://goodman777.blog24.fc2.com/">メモ</a></p>
<div style="height:70px;">
<!-- ここにメニューを挿入 -->
</div>
</div>
<!--ヘッダ終点-->
id:kent0608 No.2

kent0608回答回数220ベストアンサー獲得回数232010/12/24 19:35:38

ポイント27pt

HTMLを下記のように修正

(修正箇所にコメントを付けてあります)


<?xml version="1.0" encoding="euc-jp"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-jp" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="robots" content="index,follow" />
<meta name="author" content="<%author_name>" />

<meta name="description" content="<%sub_title><%topentry_title>について" />
<meta name="keywords" content="<%sub_title><%topentry_title>,ここにキーワード,ここにキーワード" />

<link rel="stylesheet" type="text/css" href="<%css_link>" media="screen,tv" title="デフォルト" />
<link rel="alternate" type="application/rss+xml" href="<%url>?xml" title="RSS" />
<link rel="top" href="<%url>" title="トップ" />
<link rel="start" href="<%url>" title="最初の記事" />
<!--prevpage--><link rel="prev" href="<%prevpage_url>" title="前のページ" /><!--/prevpage-->
<!--nextpage--><link rel="next" href="<%nextpage_url>" title="次のページ" /><!--/nextpage-->
<!--preventry--><link rel="next" href="<%preventry_url>" title="<%preventry_title>" /><!--/preventry-->
<!--nextentry--><link rel="prev" href="<%nextentry_url>" title="<%nextentry_title>" /><!--/nextentry-->
<title><%topentry_title><%sub_title>[<%blog_name>]</title>
</head>

<body>

<!--コンテナ開始-->
<div class="color_mainframe" id="container">

<!--ヘッダ開始-->
<div class="color_topframe" id="header">
<h1 class="introduction"><%introduction></h1>
<p id="blogtitle"><a href="<%url>"><%blog_name></a></p>
</div>
<!--ヘッダ終点-->

<!--ラップ開始-->
<div id="wrap">

<div id="top_menu">
ここにメニューの内容を記述<br />
(要求仕様)4.ヘッダーの下に、幅1162px(ブログの左枠~右枠まで)縦70pxの メニューを入れるスペース。
</div>

<!--box2開始-->
<div id="box2">

<!--メイン開始-->
<div id="main">

<!--メインボックス開始-->
<div id="mainbox">
	(要求仕様)3.中央のカラム=幅412px(訂正:512pxの間違いでは? 325+325+512=1162)<br />

	<!--エントリー開始-->
	<div class="entry color_entrybg">

	<!--@トップエントリー開始エントリーがあった場合繰り返す範囲-->
	<!--topentry-->

	<h2 class="color_entrytitle"><a href="<%topentry_link>"><%topentry_title></a></h2>
	
		<!--エントリーボックス開始ここから幅468px-->
		<div class="entrybox color_entrytext">

			<div class="date">
			<%topentry_year>.<%topentry_month>.<%topentry_day>
			</div>
			
			<!--エントリー本文-->
			<%topentry_body>

			<!--続きを読む-->
			<!--more_link-->
			<p class="right">記事:<a href="<%topentry_link>"><%topentry_title></a>の続きを読む</p>
			<!--/more_link-->
			<!--more-->
			<div id="more"><%topentry_more></div>
			<!--/more-->

			<!--投稿情報開始-->
			<div class="posted">
			<a href="<%topentry_link>">記事URL</a> | 
			<a href="<%topentry_category_link>"><%topentry_category></a> | 
			<!--allow_tb--><a href="<%topentry_link>#trackback">トラックバック(<%topentry_tb_num>)</a><!--/allow_tb-->
			<!--deny_tb-->トラックバック(-)<!--/deny_tb--> | 
			<!--allow_comment--><a href="<%topentry_link>#comments">コメント(<%topentry_comment_num>)</a><!--/allow_comment-->
			<!--deny_comment-->コメント(-)<!--/deny_comment--> | 
			【<%topentry_hour>:<%topentry_minute></div>
			<!--投稿情報終点-->
			
		</div>

		<!--エントリーボックス終点ここまで幅468px-->
		
	<!--
	<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
	 xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/"
	 xmlns:dc="http://purl.org/dc/elements/1.1/">
	<rdf:Description
	rdf:about="<%topentry_link>"
	trackback:ping="<%url>tb.php/<%topentry_no>"
	dc:title="<%topentry_title>"
	dc:identifier="<%topentry_link>"
	dc:subject="<%topentry_category>"
	dc:description="<%topentry_discription>"
	dc:creator="<%author_name>"
	dc:date="<%topentry_year>-<%topentry_month>-<%topentry_day>T<%topentry_hour>:<%topentry_minute>:<%topentry_second>+09:00" />
	</rdf:RDF>
	-->

	<!--/topentry-->
	</div>
	<!--@トップエントリー終点エントリーがあった場合繰り返す範囲ここまで-->

		<!--エントリー直下ナビゲーション開始-->
		<div class="entry_navi">
		<!--ページ移動-->
		
		<!--@コメントエリア開始-->
		<!--comment_area-->
			<!--prevpage--><a href="<%prevpage_url>">前ページ</a><br />
			<!--/prevpage-->
			<a href="<%url>">トップページ</a><br />
			<!--nextpage-->
			<a href="<%nextpage_url>">次ページ</a><!--/nextpage-->
		</div>
		<!--エントリー直下ナビゲーション終点-->

		<!--ボトム-コメント・TB表示部分開始-->
		<div class="bottom">

			<!--コメント表示部開始-->
			<p class="commment"><a id="comments" name="comments">コメント</a></p>
			<!--comment-->
			<div class="commenttext"><%comment_body></div>
				<div class="posted">
				<%comment_year>/<%comment_month>/<%comment_day> <%comment_hour>:<%comment_minute>
				<%comment_url+str> | <%comment_mail+name> #<%comment_trip> | <a href="<%comment_edit_link>" title="編集">編集</a>
				</div>
			<!--/comment-->
			<!--コメント表示部終点-->

			<!--@コメント投稿フォーム開始-->
			<p class="commment"><a id="comment_post" name="comment_post">コメントの投稿</a></p>
			<form method="post" action="./" name="comment_form" id="comment_form">
			<input type="hidden" name="mode" value="regist" />
			<input type="hidden" name="comment[no]" value="<%pno>" />
			<label for="name">NAME:</label><br />
			<input id="name" type="text" name="comment[name]" size="30" /><br />
			<label for="subject">TITLE:</label><br />
			<input id="subject" type="text" name="comment[title]" size="30" /><br />
			<label for="mail">MAIL:</label><br />
			<input id="mail" type="text" name="comment[mail]" size="30" /><br />
			<label for="url">URL:</label><br />
			<input id="url" type="text" name="comment[url]" size="30" /><br />
			<label for="comment">COMMENT:</label><br />
			<script type="text/javascript" src="http://blog69.fc2.com/load.js"></script><br />
			<textarea id="comment" cols="40" rows="8" name="comment[body]"></textarea><br />
			<label for="pass">PASS:</label><br />
			<input id="pass" type="password" name="comment[pass]" size="20" /><br />
			<label for="himitu">SECRET:</label><br />
			<input id="himitu" type="checkbox" name="comment[himitu]" />管理者にだけ表示を許可する<br />
			<div><input type="submit" value="送信" /></div>
			</form>
			<!--@コメント投稿フォーム終点-->

			<!--/comment_area-->
			<!--@コメントエリア終点-->

			<!--@コメント編集フォーム開始-->
			<!--edit_area-->
			<div id="comment_edit">
			<p class="commment">コメントの編集</p>
			<form method="post" action="./" name="comment_form">
			<input type="hidden" name="mode" value="edit" />
			<input type="hidden" name="mode2" value="edited" />
			<input type="hidden" name="edit[rno]" value="<%eno>" />
			<label for="name">NAME:</label><br />
			<input id="name" type="text" name="edit[name]" size="30" value="<%edit_name>" /><br />
			<label for="subject">TITLE:</label><br />
			<input id="subject" type="text" name="edit[title]" size="30" value="<%edit_title>" /><br />
			<label for="mail">MAIL:</label><br />
			<input id="mail" type="text" name="edit[mail]" size="30" value="<%edit_mail>" /><br />
			<label for="url">URL:</label><br />
			<input id="url" type="text" name="edit[url]" size="30" value="<%edit_url>" /><br />
			<label for="comment">COMMENT:</label><br />
			<script type="text/javascript" src="http://blog69.fc2.com/load.js"></script><br />
			<textarea id="comment" cols="30" rows="8" name="edit[body]"><%edit_body></textarea><br />
			<label for="pass">PASS:</label><br />
			<input id="pass" type="password" name="edit[pass]" size="20" /><br />
			<label for="himitu">SECRET:</label><br />
			<input id="himitu" type="checkbox" name="edit[himitu]" />秘密にする<br />
			<div>
			<input type="submit" value="送信" /> 
			<input type="submit" name="edit[delete]" value="削除" />
			</div>
			</form>
			
			</div>
			<!--/edit_area-->
			<!--@コメント編集フォーム終点-->

			<!--トラックバック部開始-->
				<!--trackback_area-->
				<p class="commment"><a id="trackback" name="trackback">トラックバック</a></p>
				<div class="tburl">トラックバックURL:<br />
				<form name="tburl" id="tburl" method="post" action="#">
				<input type="text" name="trackback_url" value="<%trackback_url>" />
				</form>
		</div>
					<!--trackback-->
					<p class="tbtitle"><a href="<%tb_url>" name="trackback<%tb_no>"><%tb_title></a><%tb_blog_name></p>
					<div class="tbtext"><%tb_excerpt></div>
					<div class="posted"><%tb_year>/<%tb_month>/<%tb_day> <%tb_hour>:<%tb_minute></div>
					<!--/trackback-->
				<!--/trackback_area-->
			<!--トラックバック部終点-->

		</div>
		<!--ボトム-コメント・TB表示部分終点-->

		<!--コメントTB部下のナビ部開始-->
		<div class="center">
		<div class="entry_navi">
		<!--prevpage--><a href
id:windofjuly No.3

うぃんど回答回数2625ベストアンサー獲得回数11492010/12/24 21:55:12

ポイント26pt

変更箇所が多いので1点1点確認しながら行ってください

簡単なチェックを行ってから回答投稿してますけれど、ブラウザによってマージンとパディングの動作に違いがありますので下記の数値は鵜呑みにせずに変更の目安としてください

 

【1】htmlへの追加

classは配色の利便性からcolor_topframeではなく新たにcolor_menuframeをcss側に追加での対応としています

idは他とかぶらなければmenu以外のものでもかまいません

(1)ヘッダの枠内に追加する場合

<!--ヘッダ開始-->
<div class="color_topframe" id="header">
<h1 class="introduction">日々のメモ</h1>
<p id="blogtitle"><a href="http://goodman777.blog24.fc2.com/">メモ</a></p>
<div class="color_menuframe" id="menu">
  ここにメニューを入れる
</div>
</div>
<!--ヘッダ終点-->

(2)ヘッダの枠外に追加する場合

<!--ヘッダ終点-->
<div class="color_menuframe" id="menu">
  ここにメニューを入れる
</div>

 

【2】cssの変更と追加

私が行ったサイズ変更の一覧

830px → 1062px
660px → 737px
490px → 412px
468px → 390px
430px → 352px
170px → 325px
110px → 180px(ヘッダの枠内にメニューを追加する場合のみ)

(1)全体の幅調整

#container {
	width: 830px; → 1062px(左メニュー部+エントリー部+右メニュー部の幅)
#wrap{
	width: 830px; → 1062px
#box2 {
	width: 660px; → 737px(左メニュー部+エントリー部の幅)

(2)ヘッダ部の幅調整とHTMLで追加したid="menu"分の追加

#header {
	text-align: left;
	width:830px; → 1062px
	height : 110px; → 180px(ヘッダの枠内にメニューを追加する場合のみ高さ70pxを増量)
}
#menu {
	text-align: left;
	width:1062px
	height : 70px;
}

(3)左メニュー部の幅調整

#left {
	float : left;
	width : 170px; → 325px

(4)エントリー部の幅調整

#main {
	padding: 15px 0px;
	float: right;
	width: 490px; → 412px
#mainbox {
	margin: 0px auto;
	width: 490px; → 412px
}
.entry{
	width:490px; → 412px
	margin: 0px auto;
	text-align: center;
}

.entrybox{
	margin: 0px auto;
	width: 468px; → 390px
	text-align: left;
}
.commenttext{
	width: 430px; → 352px
.entry_navi{
	width:490px; → 412px

(5)右メニュー部の幅調整

#right {
	float : left;
	width : 170px; → 325px

(6)フッター部の幅調整

#footer {
	clear: both;
	width: 830px; → 1062px

(7)classの追加

追加する場所はどこでもかまいませんがcssファイルの先頭のほうにカラー設定がまとまっているので、

.color_topframe と .color_sidetitle の間にでも書くと判りやすいとでしょう

下記の配色や線種は.color_topframeと同一なので必要に応じて適宜変更してください

.color_menuframe{
	border-bottom : 2px solid #0066CC;
}

 

以上、7月の風ことwindofjulyでした

  • id:kent0608
    長すぎて途中で途切れてしまったようです。
  • id:kent0608
    HTML修正箇所

    <!--ラップ開始-->
    <div id="wrap">

    ーーーー(ここから開始)ーーーーー
    <div id="top_menu">
    ここにメニューの内容を記述<br />
    (要求仕様)4.ヘッダーの下に、幅1162px(ブログの左枠~右枠まで)縦70pxの メニューを入れるスペース。
    </div>

    ーーーーーーーーーーーーーーーーーーーーーー



    CSS修正箇所

    #container {
    width: 1162px;
    margin-right: auto;
    margin-left: auto;
    font-size: 13px;
    line-height: 140%;
    background-color: #FFF;
    }

    #wrap{
    width: 1162px;
    margin:0px;
    }

    #box2 {
    width: 837px;
    text-align: left;
    float : left;
    }
    #left {
    float : left;
    width : 325px;
    overflow: hidden;
    }

    #right {
    float : left;
    width : 325px;
    overflow:hidden
    }

    #main {
    padding: 15px 0px;
    float: right;
    width: 512px;
    overflow: hidden;
    }

    #mainbox {
    margin: 0px auto;
    width: 512px;
    }

    #header {
    text-align: left;
    width:1162px;
    height : 110px;
    }

    #footer {
    clear: both;
    width: 1162px;
    height: 70px;
    font-size: 12px;
    color: #063050;
    text-align: center;
    padding:10px 0px 0px 0px;
    border-top: 1px dotted #0066CC;
    }
    #top_menu {
    clear: both;
    height: 70px;
    width: 1162px;
    background-color: #E6E6E6;
    }
  • id:windofjuly
    うぃんど 2010/12/25 01:33:58
    ブラウザによってはレイアウトがぐちゃぐちゃに崩れて私の回答部分がろくに読めなくなっている場合もあるようなので日記のほうに同じものを再掲
    (極力見た目も同じように調整しましたが人力とダイアリーでは仕様が異なるため縦長になっています)
    http://d.hatena.ne.jp/windofjuly/20101224/1293207297
    ついでにcssファイルも丸ごと置いておきます
    http://d.hatena.ne.jp/windofjuly/20101224/1293208187
    丸ごとコピーで使ってもらっても良いですが、回答本文のほうを順に実施して、どこで何をしているのかを理解して欲しいですね
    (丸ごとコピーのほうが回答するのも簡単なのですが、どこで何をしているかを理解していないと、間違いにも気づかないということになりますからね)
  • id:kia_44
    回答が2点出てますので、コメントにてコツを。

    IDやクラスに対しての書き方を覚えること。
    width が幅であること。
    の2点かな。

    できれば、外部CSSへのリンクの貼り方。
    この3点を抑えられると今回の質問については自力で解決できるようになると思いますよ。

    windows環境ならば、
    http://www.kashim.com/eve/index.html 
    http://h2ham.seesaa.net/article/154387441.html
    の2つを見てみてもいいかも。何を変えたいまでが見えているのでそれはどれか、がわかればクリアできそうなんで頑張ってみてください。
  • id:nobu55
    皆様
    ご回答、ありがとうございました。
    現在、サイトを調整しております。調整が終わりましたら、
    質問を終了させていただこうと思います。
  • id:nobu55
    ご回答、ありがとうございました。
    いただいた回答は、どの回答も大変ありがたく参照させていただきました。
    適応箇所毎に説明を付けて下さった、windofjulyさんにいるか賞を進呈させていただきます。
    皆さま本当にありがとうございました。

  • id:windofjuly
    うぃんど 2011/01/07 20:20:27
    質問になさったのですね。コメントに書いていただければ、よかったのに・・・後からなら何とでも書けますね(笑)
    http://q.hatena.ne.jp/1293955268
     
    遅まきですし、何の証拠能力もありませんが、年明け2日にメッセージ付きポイント送信でお約束どおりのポイントをお送りいただきましたこと、ここに記します
    ありがとうございました

この質問への反応(ブックマークコメント)

トラックバック

  • 人力検索へのフォロー http://q.hatena.ne.jp/1293182450 のレイアウトが崩れているので、こちらにも記載   変更箇所が多いので1点1点確認しながら行ってください   簡単なチェックを行ってか
  • 人力検索へのフォロー http://q.hatena.ne.jp/1293182450 について ついでなのでcssファイル丸ごとも置いておきます @charset &quot;EUC-JP&quot;; /*Sea_Simple_Seo_v2 ---------------------------------------------------------*/ /
「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません