こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

ブログトップページの記事1と記事2の間に謎の空白

livedoorでブログを作りました。
トップページで、1つ目の記事と2つ目の記事の間に謎の空白ができてしまいます。
1ページに3記事表示する設定にしているのですが、
1| 2|3|
という表示になってしまっています。
1つめの記事タイトルの下にツイートボタン、仕切り線、2つ目の記事タイトル…というデザインなのですが、仕切り線と次の記事の間に空白ができます。
ドラッグ選択してみると大きな1つの何かがあるみたいです。
2ページ目にいくと 4| 5|6| という、同じ状態になってしまいます。
個別記事ページでは問題がありません。
つまりブログパーツの問題ではなく、トップページのテンプレに問題があるのでは?
テンプレートにミスがあるのかと思い、別のテンプレートも試しましたがダメでした。
一瞬ちゃんと表示されるのですが、すぐに空白が現れてしまいます。
ブログのURLを晒すのは恥ずかしいので、問題のありそうな箇所のソース(1つ目の記事のフッターから2つ目の記事のタイトルにかけて)を貼り付けてみます。
ブログのURLはexample、記事のタイトルは「記事1」のように変更しました。


<!-- 記事フッター、カテゴリ、コメント、ソーシャルボタン -->
<footer class="article-footer">
<ul class="article-meta">

<li class="article-comment-count">
<dl><dt>コメント数:</dt><dd><a href="http://example.doorblog.jp/archives/20344743.html#comments">0 コメント</a></dd></dl>
</li>


<li class="article-category">
<dl><dt>カテゴリ:</dt><dd class="article-category1"><a href="http://example.doorblog.jp/archives/cat_643832.html">History</a></dd></dl>
</li>

<li class="article-author">by <span itemprop="author">example<span></li>
</ul>
<ul class="article-social-btn">
<a href="https://twitter.com/share" class="twitter-share-button" data-count="none" data-url="http://example.doorblog.jp/archives/20344743.html" data-text="記事1 - [ブログのタイトル]" data-lang="ja">Tweet</a><script charset="utf-8" type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fexample.doorblog.jp%2Farchives%2F20344743.html&amp;send=false&amp;layout=button_count&amp;width=110&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font=arial&amp;height=20" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:110px; height:20px;" allowTransparency="true"></iframe>

</ul>
</footer>
<!-- /記事フッター、カテゴリ、コメント、ソーシャルボタン -->

</article>
<!-- /記事全体 -->

<div id="ad2"></div>


<script type="text/javascript"><!--
if (ld_blog_vars) {
ld_blog_vars.articles.push({
id : '20344742',
permalink : 'http://example.doorblog.jp/archives/20344742.html',
title : '記事2',
categories : [ { id:'643834', name:'Tragedy', permalink:'http://example.doorblog.jp/archives/cat_643834.html' }, { id:'', name:'', permalink:'' } ],
date : '2012-09-07 08:12:15'
});
}
//-->
</script>



<!--
<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="http://example.doorblog.jp/archives/20344742.html"
trackback:ping="http://trackback.blogsys.jp/livedoor/example/20344742"
dc:title="記事2"
dc:identifier="http://example.doorblog.jp/archives/20344742.html"
dc:subject="category2"
dc:description="記事2の本文"
dc:creator="example"
dc:date="2012-09-07T08:12:15+09:00" />
</rdf:RDF>
-->

<!-- 記事全体 -->
<article class="article" itemscope itemtype="http://schema.org/BlogPosting">
<!-- 記事ヘッダー、記事タイトル -->
<header class="article-header">
<p class="article-date"><time datetime="2012-09-07T08:12:15+0900" pubdate="pubdate">September 07, 2012</time></p>
<h1 class="article-title" itemprop="name"><a href="http://example.doorblog.jp/archives/20344742.html" itemprop="url">記事2のタイトル</a></h1>

</header>
<!-- /記事ヘッダー、記事タイトル -->

<!-- 記事本文 -->
<div class="article-body">
<div class="article-body-inner">

投稿日時 - 2012-12-03 04:07:16

QNo.7827285

暇なときに回答ください

質問者が選んだベストアンサー

>ツイートボタン、仕切り線、2つ目の記事タイトル…というデザイン
とはお書きですが、「仕切り線」と「2つ目の記事タイトル」の間には「コマーシャル」があるのではないでしょうか。。。

 それはさておき、
<article class="article first-article" ~~>
の行は、削除しても変化はなさそうですが、

<article class="article" ~~>
の行を削除すると「コマーシャル」と、「2つ目の記事タイトル」との間の「謎の空白」が無くなり、
<article class="article last-article" ~~>
の行を削除すると「2つ目の記事と3つ目の記事の間」の「謎の空白」が無くなるかと存じます。

<article ~~> の行が何のために置かれているのかの詳細は存じませんが、ある Livedoor ブログの html ソースで検証してみましたところ、これらの行を削除しても、トップページでは、添付画像のように、余白がなくなっただけで、別段の問題はなさそうでした。

大変申し訳ございませんが、この投稿に添付された画像や動画などは、「BIGLOBEなんでも相談室」ではご覧いただくことができません。 OKWAVEよりご覧ください。

マルチメディア機能とは?

参考URL:http://iamnotthatiplay.doorblog.jp/

投稿日時 - 2012-12-03 15:48:06

お礼

回答ありがとうございます。
ご指摘の通り、広告欄でした。
Google Chromeで広告ブロックするアドオン(Adblock)を使用しているため、広告がブロックされて真っ白になっていたようです。

投稿日時 - 2012-12-03 22:22:12

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問