【问题标题】:datalist items need to float数据列表项需要浮动
【发布时间】:2012-04-01 15:49:29
【问题描述】:

我有以下使用数据列表控件创建的代码:

http://jsfiddle.net/vmE2E/1/

但我无法将它们并排浮动到 UL 之间,并在两者之间进行填充。 请问您能帮忙吗?

编辑:添加代码

<span style="display:inline-block;background-color:Transparent;border-color:#404040;border-style:None;" id="DataList1"><span style="color:Transparent;background-color:Transparent;">

                <ul class="latest-posts">
                   <li>
                    <a href="http://www.site.co.uk/blog/post/using-jquery.aspx">
                        using jquery<br>
                    </a>
                    </li>
                </ul>

            </span><br><span style="color:Transparent;background-color:Transparent;">

                <ul class="latest-posts">
                   <li>
                       <a href="http://www.test.co.uk/First-Blog-Post.aspx">
                        First Blog Post<br>
                    </a>
                    </li>
                </ul>

            </span></span>

css

ul.latest-posts
{
    width:500px;
    border:1px solid black;
}


ul li.latest-posts

{
    float:left;            
}

【问题讨论】:

  • 请在您的帖子中包含代码。
  • 我已经包含了一个包含代码的 jsfiddle
  • 是的,但是问题应该是独立的并且可以理解,而无需点击链接。该演示是一个很棒且有用的补充,但是如果链接断开或 jsfiddle (暂时)关闭怎么办?所以请添加您的代码。
  • 明白,我添加了一些代码。对不起
  • 亲爱的,看看我的回答,如果我落后了,请告诉我。

标签: css datalist


【解决方案1】:

这是对标记的一些不寻常/不必要的使用(内联块spanspan 用作块元素的容器等)。简单地删除 &lt;br&gt; 将使您的部分彼此相邻(但不是因为它们浮动,而是因为它们是 span,这意味着它们保持内联)

【讨论】:

    【解决方案2】:

    查看 fiddle 的代码和演示

    小提琴:http://jsfiddle.net/vmE2E/2/

    演示:http://jsfiddle.net/vmE2E/2/embedded/result/

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-11-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-06-20
    • 2018-06-23
    • 2012-04-29
    相关资源
    最近更新 更多