PCインストラクターの川上です。
「どうしてCSSの設定ミスでなく、プラグインのソース間違いだとわかったのですか？」
これは、インターネットエクスプローラー（以降IEとします）であれば、 「開発者ツール」というのがありますので、これで人様のHPやブログのHTMLやCSSを確認することができるんです。
（もちろん、他のブラウザにもありますよ^^）
そもそも、
アクセスランキングをスクロール表示にしてみた
の記事で、
プラグインとCSSの設定をするとできます～
と書いたのですが、苦戦されている方がいらっしゃったもので･･･
で、その方が、設置したCSSを見てください、とアメブロのメッセージで送ってきたのですが･･･
こんなんなって、よくわからなかったりします^^ゞ
そこで、私の方で、その「開発者ツール」を使って確認させてもらいました。
［開発者ツール］を使って確認
その方法は
●インターネットエクスプローラー（IE）の場合は、
［ツール］－［開発者ツール］
（メニューバーが表示されていない場合は、 『インターネットエクスプローラーにメニュバーがない？』をご覧ください。）
●Google chrome（グーグル クロム）の場合は、右上の［三］（Google chromeの設定ボタン）－［ツール］－［デベロッパーツール］
●Firefox（ファイアフォックス）の場合は、［ツール］－［Web開発］－［開発ツールを表示］
（メニューバーが表示されていない場合はIEと同様の方法↑で表示してください。）
●MacのSafari（サファリ）の場合は、
まず、［Safari］－［環境設定］（Windows版は［編集］－［設定］）で、「詳細」内の一番下にある「メニューバーに”開発”メニューを表示」にチェックを入れる。
その後、［開発］－［Webインスペクタを表示］を選択。
すると、開発者ツールが表示されます。（IEで進みます。）
（Google chromeやFirefoxやSafariの場合は、若干操作方法が異なりますのでご注意を。）
左上にある白い矢印をクリックして、
プラグインの場所をクリックします。
（今回はどうもここあたりが怪しい、ということで･･･）
すると、<div class="ranking">の位置が選択されます。
右側にCSSも表示されます。
CSSはきちんとかかっているようですね。
でも、ちょっと「height」の左にあるチェックマークをクリックしてはずしてみましょう。
すると、怪しいところの高さがなくなるのが確認できます。
ということで、CSSは問題なく設定されているということがわかります。
あとは、プラグインでの設定が違っている可能性が高い、ということもわかります。
すなわち、
どうしてCSSの設定ミスでなく、プラグインのソース間違いだとわかったのですか？
の答えが必然的にわかってしまったのです！
でも･･･
プラグインのソース間違いはなんだったのか･･･
ACRアクセスランキングのブログパーツに
<div class="ranking"></div>
を前後につけていたのではなく、
NINJA TOOLS
につけていたからだったのです、ハイ！
といったことも、開発ツールで遠隔でわかってしまうので、便利なツールですよね～^^!
それを、お伝えして･･･
すると、ともともさんから
「川上さーん、やっとできましたー！
本当にありがとうございました。」
と嬉しいメッセージが！
で、確認してみると、ちゃんとスクロールができていますね。
そして、さらにともともさんから、このように記事でご紹介していただきました↓↓↓
↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓
ACRランキングをスクロールできるようにしました
めでたし、めでたし･･･^^
この「開発ツール」を使うことによって、参考にしたいホームページやブログのHTMLタグやプラグイン設定や、フリーフォーム、グローバルナビの設定、ヘッダー画像の設定、CSSまでも知ることができます。
ぜひ、試してみる（遊んでみる？勉強してみる？）といいですね^o^!
それと･･･
誰か、Google chromeやFirefoxやSafariの開発ツールの使い方を記事にされた方がいたら、ココ↓↓↓にリンクしますよ～（笑）
または、「開発者ツールの使い方」なんて記事を作られた方、作られていた方も･･･^^
・ココ
＜追記＞
早速、加藤さんが記事アップしていただきました～
↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓
googleChrome 開発者ツール（デベロッパーツール）の基本の使い方。
そちらの記事（コメント欄含む）も書いているのですが、
最近、東大で流行っているのが ドットインストールですって。
そして、みんなドットインストールで３分の勉強をしているようなんですね^o^
確かに、ドットインストールは無料で勉強するには最適ですよね^^!
そのドットインストールはこちら↓↓↓ですので、ご参考までに！
↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓
以上、開発者ツールのワンポイントレッスンでした。
LIDS澄川・ライフデザインスクール
川上 雄大