Нежелательное пространство между div

Question

Я пытаюсь подключить три изображения для своего блока контента, но по какой-то причине между вторым и третьим есть место. Любая помощь будет оценена.

вот сайт: http://hyvhuynh.com/hyperbolical-blog

<?php get_header(); ?>

<div id="content">

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

<div <?php post_class();?> id="post-<?php the_ID();?>">
<div id="mythreedivs">
<div id="top">
</div>

<div id="mid">
<h2 class="post-title"><a href="<?php the_permalink() ?>" rel="bookmark" title="Post <?php the_ID(); ?> - permanent link"><?php the_title(); ?></a></h2>

<ul class="meta">
<li><?php the_time('F j, Y'); ?></li>

</ul>

<div class="postcontent">
<?php the_content(the_title('', '', false)." - continue reading"); ?>
</div>

<ul class="meta postfoot">
<?php if('open' == $post->comment_status) : ?><li class="comment_link"><?php comments_popup_link('Comment on '.$post->post_title, '1 Comment on '.$post->post_title, '% Comments on '.$post->post_title,'postcomment','Comments are off for '.$post->post_title); ?></li><?php endif;?>


<?php if(get_the_tag_list()) :?>
<li>Tags: <?php the_tags('<ul><li>',',</li> <li>','</li></ul>');?></li>
<?php endif;?>
</ul>

</div>

<?php endwhile; ?>

<ul class="prevnext">
<li><?php next_posts_link('&laquo; Older Posts'); ?></li>
<li><?php previous_posts_link('Newer Posts &raquo;');?></li>

</ul>



<div id="bottom">

</div>
<?php endif; ?>

</div>



</div>
<?php get_footer(); ?>

--------- CSS ---------------

#mid {
    background-image:url('http://hyvhuynh.com/wp-content/themes/zenlite/images/bodymiddle.png');
    width:806px;
}

#bottom {
    background-image:url('http://hyvhuynh.com/wp-content/themes/zenlite/images/bodybottom.png');
    width:806px;
    height:27px;

}

#header {
width:800px;
float:right;
margin:0 0 50px 0;  
}


/* 
Navigation Bar Time!
*/  

#jsddm
{   margin: 20px 0 0 0;
    padding: 0;
    font-weight:bold;
    text-shadow: #000000;

}

    #jsddm li
    {   float: left;
        list-style: none;
        font: bold 12px Tahoma, Arial}

    #jsddm li a
    {   display: block;
        background: #E7E7EF;
        padding: 5px 12px;
        text-decoration: none;
        border: 1px solid #555555;
        width: 70px;
        color:#000000;
        white-space: nowrap}

    #jsddm li a:hover
    {   background: #1A4473}

        #jsddm li ul
        {   margin: 0;
            padding: 0;
            position: absolute;
            visibility: hidden;
            }

        #jsddm li ul li
        {   float: none;
            display: inline}

        #jsddm li ul li a
        {   width: auto;
            background: #E7E7EF}

        #jsddm li ul li a:hover
        {   background: #1A4473}

/*
End Navigation Time!
*/


.logo {
    float:right;
}

#content .post {
    float:left;
    width:800px;
}


#content .page,#content .attachment,.postcontent {

    width:800px;
    text-decoration:none;

}

.photo {
    width: 250px;
    height:700px;
    background-color:#000000;
    margin:0 0 0 880px;
}

.slideshow { height: 232px; width: 232px; margin:0 0 0 880px;  }
.slideshow img {  border: 5px solid #000;  }

.post-title {
    margin:0;
    padding:0;
    text-align:center;
}
.post-title a {
    text-decoration:none;
    color:#000000;
}
.post-title a:hover,.post-title a:active,.post-title a:focus {
    text-decoration:underline;
    color:#5F625F;
}
#content .meta li,#content .prevnext li,#content .gallery li {
    list-style-image:none;
    list-style:none;
}
.meta {
    margin:5px 0 0;
    padding:0;
    font-size:.85em;
}
.meta ul,.meta li {
    margin:0;
    padding:0;
}
.meta ul {
    display:inline;
}
.meta li li {
    display:inline;
    padding-right:.3em;
}
.postfoot {
    clear:both;

    padding-bottom:10px;
    line-height:1.2em;
}
.author .posts-by {
    padding-top:10px;
}

.clearfix {  
display: inline-block; }

.clearfix:after { 
content: " ";
display: block;
height: 0;
clear: both;
visibility: hidden; 
}


#footer {
    clear:both;
    margin:0 auto;
    padding:0 0 5px;
    text-align:center;
    font-size:.8em;
    border: 0;
    width:800px;
    height:200px;

}
#footer ul {
    clear:both;
    margin:0;
    padding:0;
}
#footer li {
    display:inline;
    margin:0;
    padding:0 5px;
}
#footer li.rss {
    position:relative;
    top:3px;
}


.copyright {

}

.copyright a
{

}

.copyright a:hover
{

}





.postcontent p {
    text-decoration:none;
    border:0;
    border-style:none;
    }

    .postcontent p a:hover {
        color:#fff;

    }

Answer 1

Пробел от поля в вашем неупорядоченном списке. Добавьте это к вашей таблице стилей

ul.prevnext {margin: 0px;}

И это исправит. Я не уверен, что вы делаете с этим, хотя, поэтому вы можете просто отказаться от него сейчас, потому что, как только вы добавите какие-либо элементы, он снова появится Или переместите его в другое положение, как указано в mltsteeves.

Answer 2

В вашей разметке ошибки вложения . Сначала я бы разобрался с ними, из того, что я вижу в Firebug, он мог бы уже разобраться.

конец тега для "div" опущен, но указан OMITTAG NO

конечный тег для "ul", который не закончен

Answer 3

<ul class="prevnext"> вызывает пробел между двумя элементами, попробуйте поместить его внутрь предыдущего div.

Answer 4

Блок ниже:

не содержится внутри правильного тега

, он находится между вашим средним и нижним делителями.