请教：如何修改下面的CSS代码让标题和日期在同一水平线上，不加标题前的图标用vertical-align就好控制。加了就不能控制了。。

luoxp520 2008-08-26 02:00:18



<html >

<head>

<style type="text/css">

body,td,th {

	font-size: 9pt;

}

ul{

	list-style-type: none;

	display:inline;

	margin:0px;

}

li{

	list-style-type: none;

	text-indent:5px;

	display:inline;

	margin:0px;

	font-size: 12px;

	line-height: 25px;

	height: 25px;

}

.InfoList5_Item_Div{float:left;width:530px;}

.InfoList5_Title_Div{float:left;width:420px;line-height:30px; height:30px; vertical-align:bottom;}

.InfoList5_Title_Div ul li img{}

.InfoList5_Date_Div{float:right;display:inline;width:90px;vertical-align:middle; line-height:30px; height:30px;}

#InfoList5_Item_Title_0{ background-color:#CCCCCC;}

#InfoList5_Item_Date_0{ background-color:#ff0000;}

</style>



</head>



<body>

<div id="InfoList5_Item_0" class="InfoList5_Item_Div">

		<span id="InfoList5_Item_Title_0" class="InfoList5_Title_Div"><ul>

			<li><img src="images/ygjsy_sy_35.gif" alt="ico" title="ico" style="border-width:0;" /><a href="/pages/news/2008-08-19/1471.aspx" target="_blank" title="党外人士齐聚一堂 共商道路运输发展——我省召开道路运输发展座谈会"><font face="宋体"">党外人士齐聚一堂 共商道路运输发展——我省召开道路运输发展座谈...</font></a></li>

		</ul></span><span id="InfoList5_Item_Date_0" class="InfoList5_Date_Div"><ul>

			<li>[ 2008-08-19 ]</li>

		</ul></span>

	</div>

</body>

</html>

...全文

157 6 打赏收藏转发到动态举报

写回复

用AI写文章

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

hezhenyun 2008-08-26

打赏
举报

[Quote=引用 3 楼 web78dy 的回复:]
图片加个 align="absmiddle"
即: <img src="images/ygjsy_sy_35.gif" align="absmiddle" alt="ico" title="ico" style="border-width:0;" />
[/Quote]
up

飘零雾雨 2008-08-26

打赏
举报

改一下结构先

街头小贩 2008-08-26

打赏
举报

图片是一个BBS的表情（20×20）

web78dy 2008-08-26

打赏
举报

图片加个 align="absmiddle"
即:<img src="images/ygjsy_sy_35.gif" align="absmiddle" alt="ico" title="ico" style="border-width:0;" />

街头小贩 2008-08-26

打赏
举报

刚才突然想到，造成不在一条线的原因在于图片的定位，图片在盒子中是流动的,我稍微改了一个你的代码:



<html >

<head>

<style type="text/css">

body{margin:0;padding:0;}

#InfoList5_Item_0{position:relative;margin:0;padding:0;width:100%;border:1px solid #f00;}

#InfoList5_Item_0 ul{float:left;margin:0;padding:0;border:1px solid #333;height:30px;}

#InfoList5_Item_0 ul li{float:left;margin-bottom:1px;padding:0;width:auto;list-style:none;;border:1px solid #ddd;height:inherit;}

#InfoList5_Item_0 ul img{float:left;display:block;margin:0;padding:0;border:1px solid #green;}



</style>



</head>



<body>

<div id="InfoList5_Item_0" class="InfoList5_Item_Div">

        <span id="InfoList5_Item_Title_0" class="InfoList5_Title_Div">

			<ul>

            <li>

				<img src="lol.gif" alt="ico" title="ico" />

				<a href="/pages/news/2008-08-19/1471.aspx" target="_blank" title="党外人士齐聚一堂 共商道路运输发展——我省召开道路运输发展座谈会">

				<font face="宋体">党外人士齐聚一堂 共商道路运输发展——我省召开道路运输发展座谈...</font></a>

			</li>

        	</ul>

			<ul class="aa">

            	<li>[ 2008-08-19 ]</li>

        	</ul>

		</span>

    </div>

</body>

</html>