div+css
想实现chinaren首页的效果,控制最新留言居中,左和右都是图片,发现预览的时候图片排列很不规则,谢谢大家了,
<DIV class=news_tit> <SPAN class=float_left> <IMG src= "indeximage/minlogo.gif "> 最新留言 </SPAN> <A
href= "http://www.chinaz.com/Program//Index.html "> More... </A>
<DIV class=clear_float> <IMG alt= " "
src= "indeximage/space.gif "> </DIV>
</DIV>
下面是css
.news_tit {
PADDING-RIGHT: 10px; PADDING-LEFT: 10px; FONT-WEIGHT: bold; BACKGROUND: #DCDCDF; MARGIN-BOTTOM: 2px; PADDING-BOTTOM: 0px; COLOR: #333333; LINE-HEIGHT: 25px; PADDING-TOP: 0px; HEIGHT: 25px
}
[解决办法]
楼主的意思是中间是留言,两边是图片对吧?
左边的图片和留言区域都用float:left;
右边的图片可以用float:right;
<html>
<head>
<style>
body {margin:0 auto; text-align:center; font-size:12px;}
#news {width:720px; text-align:left;}
#news .imgLeft {width:160px; float:left;}
#news .newslist .title {
width:430px;
font-weight:bold;
background:#DCDCDF;
color:#333;
line-height:25px;
height:25px;
float:left;
}
#news .newslist .content {
width:430px;
background:#EEE;
color:#333;
font-weight:normal;
float:left;
padding:0 10px;
}
#news .imgRight {width:130px; float:right; text-align:right;}
</style>
</head>
<body>
<div id= "news ">
<div class= "imgLeft "> <img src= "http://www.csdn.net/ui/styles/public_header_footer/logo_csdn.gif "> </div>
<div class= "newslist ">
<div class= "title "> 最新留言 </title>
<div class= "content "> 留言内容留言内容留言内容留言内容留言内容留言内容留言内容留言内容留言内容留言内容留言内容留言内容留言内容留言内容 </div>
</div>
<div class= "imgRight "> <img src= "http://zi.csdn.net/new.jpg "> </div>
</div>
</body>
</html>