The method of making news list in web typesetting with DIV+CSS

css| Web page CSS code:
. list{
margin:0px 10px 20px;
Text-align:left;
}

. List ul{
List-style-type:none;
margin:0px;
padding:0px;
}

. List li{
Background:url (/news/images/line.gif) Repeat-x bottom;
/* The dashed line at the bottom of the list *
width:100%;
}

. List Li a{
Color: #777777;
Display:block;
padding:6px 0px 4px 15px;
Background:url (/news/images/dot.gif) no-repeat 0 6px;
/* The arrow on the left of the list * *
}

. List Li span{
Float:right;/* makes span elements float to the right
text-align:right;/* Date Right Alignment * *
}

. List Li a:hover{
Color: #336699;
Background:url (/news/images/dot2.gif) Repeat-x bottom;
}
Note: Span must be placed in front, and vice versa will result in line wrapping

Xhtml:

• 2005 year May 30 News headlines 01


• 2005 year May 30 News headlines 02


• 2005 year May 30 News headlines 03


• 2005 year May 30 News headlines 04