Как мне соединить эти элементы? - PullRequest
0 голосов
/ 04 сентября 2011

Я хочу поставить 3 деления, но не могу. Я не знаю, что не так.

Вот скриншот .

HTML

<div id="container">
    <?php if(have_posts()) : ?>
        <?php while(have_posts()) : the_post(); ?>
            <div class="post" id="post-<?php the_ID(); ?>">
                <h2>
                    <a href="<?php the_permalink(); ?>"title="<?php the_title(); ?>"><?php the_title(); ?></a>
                </h2>
            </div>
            <div class="entry"><?php the_content(); ?></div>

            <p class="postmetadata">
                <?php _e('Filed under&#58;'); ?> <?php the_category(', ') ?> <?php _e('by'); ?> <?php  the_author(); ?><br />
                <?php comments_popup_link('No Comments &#187;', '1 Comment &#187;', '% Comments &#187;'); ?>
                <?php edit_post_link('Edit', ' &#124; ', ''); ?>
            </p>
        <?php endwhile; ?>

        <div class="navigation"><?php posts_nav_link(); ?></div>

    <?php else : ?>
        <div class="post"><h2><?php _e('Not Found'); ?></h2></div>
    <?php endif; ?>
</div>

CSS

.post{
  padding: 10px 5px 0 5px;
  background-image: url(images/toppost.png);
  background-repeat:no-repeat !important;
}


.post h2{
  font-family: Arial, Sans-serif;
  font-size: 18px;
  margin: 0px 0 0px 0px;
}

.entry{
  background-image:url(images/ContentBG.png);
  margin: 0 0 0 0;
  padding:0 5px !important;
  background-position: bottom;
}

.postmetadata {
  clear: both;
  background-image: url(images/post-footer.png);
  background-repeat: no-repeat;
  height:118px;
  padding:0 5px !important;
}

Ответы [ 2 ]

3 голосов
/ 04 сентября 2011

Вам, вероятно, нужно убрать поля из элементов внутри этих DIV.Например, если последний элемент в вашем первом DIV имеет нижнее поле, он будет «просачиваться» и вызывать пробелы.То же самое касается первого элемента во втором DIV и т. Д.

Попробуйте создать этот документ:

<html>
  <head>
    <style>
    /*p, h2 { margin: 0; }*/
    </style>
  </head>

  <body>
    <div style="background-color: #eee;"><p>Lorem ipsum</p></div>
    <div style="background-color: #ddd;"><p>Dolor sit amet</p></div>
  </body>
</html>

и сравните, что происходит, когда вы раскомментируете стиль.Обратите внимание, что есть цвета фона, чтобы вы могли визуализировать DIV.

0 голосов
/ 04 сентября 2011

Div - это блочные элементы, поэтому вам также необходимо удалить margin-height из них с margin-height: 0px;

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...