(cache) 「はてなブログ」なのに「はてなブログ」のにおいを消す。続報。

昨日書いた記事
www.fair-skinned-monster.com
ですが２つほどご指摘を頂いたので修正しました。

修正点

変更したのは以下です。

サイドバーのタイトル幅修正しました。

「はてなブログ」なのに「はてなブログ」のにおいを消す。はてなIDとか更新日を消し去る。 - 攻めは飛車角銀桂守りは金銀三枚
スポンサーリンクの吹き出しを320px？にすれば個人的に完璧(∩´・`∩)
2016/03/25 21:01

b.hatena.ne.jp

サイドバーのタイトルが少し大きかったので調整しました。
CSSは

/*サイドバータイトルの大きさ*/
.hatena-module-title{
	width: 290px;
}

ちょっとだけ変更。あれ？なんか逆ですね・・・小さくしました。

F12 :)

次はこれ。

「はてなブログ」なのに「はてなブログ」のにおいを消す。はてなIDとか更新日を消し去る。 - 攻めは飛車角銀桂守りは金銀三枚
F12 :)
2016/03/25 12:14

b.hatena.ne.jp

「F12 :)」・・・最初意味が分かりませんでしたが、F12キー押したらわかりました。
エラー出てましたね。
エラーは「パンくずリスト」の設定で必要なJavascriptの読み込みが抜けてました。

ぽけっとしすてむ (id:psne) 先生、いつもありがとうございます。

・・・って合ってますよね？

ついでにCSSでボックス作ってメニューっぽいの

ついでにCSSでボックス作ってメニューっぽいの付けてみました。

こんなの。

これはコード表のページにつけてどのキーのコードにも飛べるようにしてみました。

ちょっと横幅微妙で、文字も少し上にずれているように思えますが、ここはIT技術者のわたし、WEBデザイナーではないのでそんな細かいことは気にしません。

実装した内容は以下の通りです。
スタイルシートは

<style>
 ul.flexbox {
        display:flex;
}
ul.flexbox li {
        width:40px;
        height:25px;
        list-style-type:none;
        background:black;
        border-left:1px solid white;
        color:white;
        text-align:center;
        vertical-align: middle;
}
ul.flexbox a:link    { color:#ffffff ; text-decoration:none ; vertical-align:middle ; text-align:center ; }
ul.flexbox a:visited { color:#ffffff ; text-decoration:none ; vertical-align:middle ; text-align:center ; }
ul.flexbox a:hover   { color:#FF0000 ; text-decoration:none ; vertical-align:middle ; text-align:center ; font-weight:bold ; }
ul.flexbox a:active  { color:#ffffff ; text-decoration:none ; vertical-align:middle ; text-align:center ; }
</style>

で、HTMLは

<ul class="flexbox">
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-c"       target="_top">C</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-c-sharp" target="_top">C#</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-d-flat"  target="_top">D♭</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-d"       target="_top">D</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-d-sharp" target="_top">D#</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-e-flat"  target="_top">E♭</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-e"       target="_top">E</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-f"       target="_top">F</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-f-sharp" target="_top">F#</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-g-flat"  target="_top">G♭</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-g"       target="_top">G</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-g-sharp" target="_top">G#</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-a-flat"  target="_top">A♭</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-a"       target="_top">A</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-a-sharp" target="_top">A#</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-b-flat"  target="_top">B♭</a></li>
 <li><a href="http://acoustic-guitar.hatenablog.com/entry/chord-b"       target="_top">B</a></li>
</ul>

このHTMLをiframeタグで各ページに読み込んでます。
acoustic-guitar.hatenablog.com