如何在<div> </div> </ul> </span>内显示<span>和<ul>内联

时间:2010-01-29 22:46:33

标签: css

我希望以下代码只显示1行文本。我怎样才能摆脱跨度和ul之间的中断?

<div id="twitter_div">
<span class="talenthouse">@twittername: </span>
 <ul id="twitter_update_list">

 </ul>
</div>

使用以下CSS:

*{
 margin: 0;
 padding: 0;
}

#twitter_div{
 font-family:"lucida grande",tahoma,arial,sans-serif;
 color: #999999;
 font-size: 71%;
 background: url(images/twitter_bg.gif) top left no-repeat;
 width: 965px;
 height: 48px;
 overflow: auto;
 padding: 15px 0 0 85px;
}

.talenthouse{
 font-family: "Helvetica Neue", "lucida grande",tahoma,arial,sans-serif;
 color: #80c242;
 font-weight: bold;
 font-size: 135%;
 display: inline;

}

ul#twitter_update_list{
 list-style: none;
 width: 780px;
 height: 15px;
 display: inline;
}

5 个答案:

答案 0 :(得分:2)

试试这个CSS。

<style type="text/css">
    ul, li, ol{display:inline}
</style>

答案 1 :(得分:1)

简短回答:把它放在你的CSS中。

ul#twitter_update_list, ul#twitter_update_list li { display: inline; }

答案 2 :(得分:0)

尝试使用重置表从元素中删除所有填充/边距。 Google为'eric meyer重置表'。

然后将列表显示为要显示的内容:inline;

答案 3 :(得分:0)

您可以将CSS设置为显示UL内联。这也将删除点。

 #twitter_div li { display: inline; }

由于

岸堤

答案 4 :(得分:-1)

我相信这应该有效:

#twitter_div span { float: left; }
#twitter_update_list { float: left; margin: 0; }

编辑:我刚刚添加了保证金:0,使列表达到与跨度相同的水平。