Advanced Search

Return to Snippet

Revision: 26255
at October 12, 2010 06:46 by PeteW
Updated Code 
/* display ordered list as comma list */
ul.commaList li:after{
	content: ',';
	padding-right: 5px;
}

ul.commaList li:first-child {
	text-transform: capitalize;
}

ul.commaList li:nth-last-child(2):after {
	content: '';
	padding-right: 5px;
}

ul.commaList li:last-child:after {
	content: '.';
	clear: both;
}

ul.commaList li:last-child:before {
	content: 'and ';
	padding-right: 0;
}

ul.commaList li:only-of-type:before {
	content: '';
	padding: 0;
}

Revision: 26254
at April 22, 2010 14:38 by PeteW
Updated Code 
/* display ordered list as comma list */
li:after{
	content: ',';
	padding-right: 5px;
}

li:first-child {
	text-transform: capitalize;
}

li:nth-last-child(2):after {
	content: '';
	padding-right: 5px;
}

li:last-child:after {
	content: '.';
	clear: both;
}

li:last-child:before {
	content: 'and ';
	padding-right: 0;
}

li:only-of-type:before {
	content: '';
	padding: 0;
}

Revision: 26253
at April 21, 2010 17:39 by PeteW
Initial Code 
/* display ordered list as comma list */
li:after{
	content: ',';
	padding-right: 5px;
}

li:first-child {
	text-transform: capitalize;
}

li:nth-last-child(2):after {
	content: '';
	padding-right: 0;
}

li:last-child:after {
	content: '.';
	clear: both;
}

li:last-child:before {
	content: ' and ';
	padding-left: 5px;
	padding-right: 0;
}

li:only-of-type:before {
	content: '';
	padding: 0;
}
Initial URL 

                                

                                                            

                                    

                                        

                                        Initial Description
                                        

                                    

                                    
Displays HTML list as a gramatically correct English sentence. \r\n\r\nFor example\r\n\r\n<ul class=\"commaList\">\r\n	<li>one</li>\r\n	<li>two</li>\r\n	<li>three</li>\r\n	<li>four</li>\r\n</ul>\r\n\r\nWould be displayed as: One, two, three and four.

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
Display OL/UL list as comma separated sentence

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    
css, CSS3

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
CSS