フッターがコンテンツにくっついてしまう
-
はじめて質問いたします。
至らぬところがありましたら、ご指摘ください。現在、私のポートフォリオサイトを製作しているところです。
インターネットからダウンロードしてきたテーマ(jqueryのmasonryを使ったテーマ)
をカスタマイズしているところです。footer.phpに直接、私の自己紹介とコンタクトフォームを記述してるところなのですが、
style.cssでfooter{margin:top:30px;}を指定したところ、
トップページではfooter上部に30pxの余白が生じて問題無いのですが、
各記事のページではfooter上部に30pxの余白が生じず、
記事のコンテンツとくっついてしまいます。どなたか、この問題をご存知の方がいらっしゃいましたら、
解決法をご教授いただきたく存じます。トップページ : http://delicious.chips.jp/wordpress/
CSS : http://delicious.chips.jp/wordpress/wp-content/themes/pinbin/style.cssfooter.phpの内容
<?php /** * The template for displaying the footer. */ ?> <footer class="site-footer"> <div id="contact"> <div id="contact-info"> <div id="info_header"><img src="<?php bloginfo('template_directory');?>/images/keeponbeat.png" width="80px" height="80px" /><span id="myname">村上 享 36歳</span></div> <div class="clear"></div> <div id="info_txt">Webデザイン/ネットショップ運営/プログラミング歴 合わせて15年です。<br> 2002年から2005年までWeb製作会社にてHTML/CSSコーディングを担当していました。<br> 退社後独立し、現在までインターネットショッピング運営や独学でプログラミング学習をしていました。<br> どんな些細なことでも丁寧に対応させていただきますので、私にお手伝いできる案件がございましたら、<br>どうぞお気軽にお声がけください!</div> </div> <div id="forms"> <form action="email.php" method="POST"> <label for="name">お名前 *</label><br> <input type="text" name="name" size="40" placeholder="お名前" /><br> <label for="email">E-mail *</label><br> <input type="text" name="email" size="40" placeholder="Eメール"/><br> <label for="remail">もう一度 E-mail *</label><br> <input type="text" name="remail" size="40" placeholder="もう一度Eメール"/><br> <label for="inquily">ご用件 *</label><br> <textarea cols="39" raws="20" name="inquily" placeholder="ご用件をお書きください。"></textarea><br> <input type="submit" value="SEND"> </form> </div> </div> <!-- <div id="copyright"> <p><?php _e( 'Copyright', 'pinbin' ) ?> <?php echo date('Y'); ?> <?php bloginfo( 'name' ); ?></p> </div> // copyright --> </footer> </div><!-- // close wrap div --> <?php wp_footer(); ?> </body> </html>
よろしくお願いいたします。
3件の返信を表示中 - 1 - 3件目 (全3件中)
-
参考のため、index.phpとsingle.phpのコードも添付させていただきます。
index.php
<?php /** * Theme index file */ ?> <?php get_header(); ?> <?php if (have_posts()) : ?> <div id="post-area"> <?php while (have_posts()) : the_post(); ?> <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <?php if ( has_post_thumbnail() ) { ?> <div class="pinbin-image"><a href="<?php the_permalink() ?>"><?php the_post_thumbnail( 'summary-image' ); ?></a></div> <div class="pinbin-category"><p><?php the_category(', ') ?></p></div> <?php } ?> <div class="pinbin-copy"><h2><a class="front-link" href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2> <p class="pinbin-date"><?php the_time(get_option('date_format')); ?> </p> <?php the_excerpt(); ?> <p class="pinbin-link"><a href="<?php the_permalink() ?>">→記事を読む</a></p> </div> </div> <?php endwhile; ?> </div> <?php else : ?> <article id="post-0" class="post no-results not-found"> <header class="entry-header"> <h1 class="entry-title"><?php _e( 'Nothing Found', 'pinbin' ); ?></h1> </header><!-- .entry-header --> <div class="entry-content"> <p><?php _e( 'Sorry, but nothing matched your search terms. Please try again with some different keywords.', 'pinbin' ); ?></p> <?php get_search_form(); ?> </div><!-- .entry-content --> </article><!-- #post-0 --> <?php endif; ?> <nav id="nav-below" class="navigation" role="navigation"> <div class="view-previous"><?php next_posts_link( __( '« Previous', 'pinbin' ) ) ?></div> <div class="view-next"><?php previous_posts_link( __( 'Next »', 'pinbin' ) ) ?> </div> </nav> <?php get_footer(); ?>
single.php
<?php /** * Single post template */ ?> <?php get_header(); ?> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <?php if ( has_post_thumbnail() ) { ?> <div class="pinbin-image"><?php the_post_thumbnail( 'detail-image' ); ?></div> <div class="pinbin-category"><p><?php the_category(', ') ?></p></div> <div class="post-nav"> <div class="post-prev"><?php previous_post_link('%link', '←'); ?></div> <div class="post-next"><?php next_post_link('%link', '→'); ?></div> </div> <div class="pinbin-copy"> <?php } else { ?> <div class="post-nav"> <div class="post-prev"><?php previous_post_link('%link', '←'); ?></div> <div class="post-next"><?php next_post_link('%link', '→'); ?></div> </div> <div class="pinbin-copy"> <div class="pinbin-category"><p><?php the_category(', ') ?></p></div> <?php } ?> <h1><?php the_title(); ?></h1> <p class="pinbin-meta"><?php _e( 'By', 'pinbin' ); ?> <?php the_author(); ?>, <?php the_time(get_option('date_format')); ?></p> <?php the_content('Read more'); ?> <div class="pagelink"><?php wp_link_pages(); ?></div> <div class="posttags"><?php the_tags(); ?></div> <div class="clear"></div> <?php comments_template(); ?> </div> </div> <?php endwhile; endif; ?> <?php get_footer(); ?>
footerの手前でfloatの解除ができていないようです。
このURLが参考になるかもしれません。
http://whisper.sakura.ne.jp/diary/2009/06/cssfloat.htmlおおお…!!
見事に解決しました。
どうもありがとうございました!m(_ _)m
3件の返信を表示中 - 1 - 3件目 (全3件中)
- トピック「フッターがコンテンツにくっついてしまう」には新たに返信することはできません。