div之间不需要的空间答案

【问题标题】：Unwanted space between divsdiv之间不需要的空间
【发布时间】：2010-02-28 09:42:51
【问题描述】：

我正在尝试为我的内容框连接三个图像，但由于某种原因，第二个和第三个之间有一些空间。任何帮助将不胜感激。

这里是网站：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;

    }

【问题讨论】：

标签： php html css

【解决方案1】：

空格来自无序列表的边缘。将此添加到您的样式表中

ul.prevnext {margin: 0px;}

它会纠正它。不过我不确定你在用它做什么，所以你现在可能只想废弃它，因为一旦你添加了任何项目，它就会再次弹出。或者像 mltsteeves 提到的那样将其移动到不同的位置。

【讨论】：

【解决方案2】：

<ul class="prevnext"> 导致两个 div 之间有空格，请尝试将其放在前面的 div 中。

【讨论】：

【解决方案3】：

你有nesting errors in your markup。我会先把它们整理出来，从我在 Firebug 中看到的情况来看，它可能已经整理出来了。

省略了“div”的结束标记，但指定了 OMITTAG NO

未完成的“ul”的结束标记

【讨论】：

【解决方案4】：

下面的块：

不包含在正确的

标记中，它位于中间和底部 div 之间。

【讨论】：