Question

我在WordPress博客中设置了一些DIV样式时出了问题。我会在WordPress论坛上发布这个，但我相信它更像是一个CSS / HTML问题，而不是一个真正的WordPress问题。作为一个先驱，我会说我现在正在设计内联所有内容，只是为了试验编码（一旦我完成，我将把所有东西都转移到我的外部样式表......我想人们会跳上去如果我没有说什么的话，那我就是内联造型:)。

基本上我试图做一个嵌套的div或者我试图在无序列表中的每个列表项之间设置一个边距。我生成的列表基本上是从博客周围的其他帖子中获取信息，以显示某个类别的最新帖子（这就是PHP的内容）。

它正在显示另一个之间没有余量。它的两个div紧挨着（左边的那个显示文章图像，右边的那个显示帖子的标题和＆＃39;摘录＆＃39;）。我想窝那两个div成一个大的div，所以我可以四处移动它，并添加利润，但每当我尝试添加父DIV，它只是显示父为的div＆＃39; S仅4PX＆＃39;高个子并没有嵌套另外两个。

我也尝试设置<li>本身的样式，但是当我向整个li添加边距时，它会使两个并排的div不对齐。

I＆＃39;对不起我不＆＃39; t有一个的jsfiddle完成的，我想包括整个码（W / PHP），其我不会＆＃39;吨已经能够在的jsfiddle做

感谢您的帮助！

<ul style="list-style-type:none;">
    <?php
    global $post;
    $category = get_the_category($post->ID);
    $category = $category[0]->cat_ID;
    $myposts = get_posts(array('numberposts' => 5, 'offset' => 0, 'category__in' => array($category), 'post__not_in' => array($post->ID),'post_status'=>'publish'));
    foreach($myposts as $post) :
        setup_postdata($post);
        ?>
        <li>
            <a href="<?php the_permalink(); ?>">

                <div id="image_con" style="float:left; border:1px solid black; width:200px; height:200px; background-color:black; overflow:hidden;">
                    <div id="image_recent" style="margin-left:-50px;">
                        <?php set_post_thumbnail_size( 300, 300 );
                            the_post_thumbnail(); ?>
                    </div>
                </div>

                <div id="cr_content" style="float:right; border:1px solid black; width:356px; height:200px;">
                <?php 
                    the_title();
                    the_excerpt();
                ?>
                </div>

            </a>
        </li>
    <?php endforeach; ?>
   <?php wp_reset_query(); ?>
   </ul>

Answer 1

缩进你的代码：

<a>
  <div>

并且这违反了规则：内联元素（<div>）中没有块级元素（<a>）：因此您可以使用浏览器为非标准代码进行回退所做的任何操作。

如果它有效，它会使锚点的命中覆盖范围变得很大......

此外：

<div style="float:left">
<div style="float:right">

这些漂浮的是什么？要么你需要一些东西来强制进一步下面的块（例如样式clear: both或者只使用一个浮点数而另一个浮点数的边距大小与另一个的宽度+边界+填充相匹配）。

Answer 2

我可以立即看到一些问题：

您没有关闭<ul>代码。
您将块级元素放在内联元素中。您需要将它们声明为块级元素。

让我们在这里解决这个问题：http://jsfiddle.net/vPqDf/1/

无法创建嵌套DIV

2 个答案: