WordPressのヘッダー上部の余白
WordPressでテーマを自作しているのですが、ヘッダー上部に余白ができてしまいます。
調べてみると、多くの場合は
http://hello-design-world.com/2011/04/wordpress31head.html
のように管理バー関連の設定に問題があったようなのですが、私の場合は管理バーの表示を外しても直りません。
以下のようなソースでやっているのですが、何が原因かわかる方いたら教えてください！
※まだ作成途中なので、ファイルは以下の２つだけです。
----------------------php---------------------
<!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/TR/xhtml/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>;charset=<?php bloginfo('charset'); ?>" />
<title><?php bloginfo('name'); ?></title>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" />
</head>
<body>
<!-- コンテナ -->
<div id="container">
<!-- ヘッダー -->
<div id="header">
<h1><a href="<?php echo home_url(); ?>">
<?php bloginfo('name'); ?></a></h1>
<p id="desc"><?php bloginfo('description'); ?></p>
</div>
<!--ヘッダー終わり -->
<!-- コンテンツ -->
<div id="content">
<?php if(have_posts()): while(have_posts()):
the_post(); ?>
<div class="post">
<h2><a href="<?php the_permalink(); ?>">
<?php the_title(); ?></a></h2>
<p class="postinfo">
<?php echo get_the_date(); ?> <?php the_time(); ?>
|
カテゴリー：<?php the_category(', '); ?>
</p>
<?php the_content(); ?>
</div>
<?php endwhile; endif; ?>
</div>
</div>
</body>
</html>
----------------------css---------------------
/*
Theme Name: Testtheme
Theme URI:
Description: テストテーマ
*/
/* コンテナ */
div#container {
width: 1000px;
margin-right: auto;
margin-left: auto;
}
/* ヘッダー */
div#header {background-image: url(header.jpg);
margin-top: 0px;
margin-left: 0px;
margin-bottom: 20px}
div#header h1 {font-size: 1.875em;
font-weight: bolder;
padding: 10px 0px 0px 10px;
margin-top: 0px}
div#header h1 a {text-decoration: none;
color: #ff8c00}
div#header p#desc {font-size: 1em;
color: #ffffff;
font-weight: bolder;
padding: 0px 0px 10px 10px}
/* 記事 */
div.post {padding: 15px;
margin-bottom: 30px}
div.post h2 {background-color: #1e90ff;
font-size: 1.3em;
padding: 10px;
margin: 0}
div.post h2 a {text-decoration: none;
color: #ffffff}
div.post p {font-size: 0.875em;
line-height: 1.6;
margin-top: 10px}
p.postinfo {color: #0c8bcd;
text-align: right;
margin: 20px 0 0;
clear: both}
p.postinfo a {color: #0c8bcd}
お礼
ありがとうございます。 確認してみます。