CSS-Tips-Trick-Part-3

<!--CSS Tips and Tricks Part-3 Shapes--->

1. Triangle
	.down{
	border-left:10px solid transparent;
	border-right:10px solid transparent;
	border-top:17px solid red;
}
.left{
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	border-right:17px solid blue;
}
.right{
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	border-left:17px solid #000;

}

How to create same size triangle:

	Here is a Formula
	/*Formula for same size triangle
	(border-left-width + border-right-width)*0.866 */
Example for up : (10+10)*0.866===17.32

2. List item styling
.list-1 li:before{
	content:"";
	display:inline-block;
	height:0;
	width:0;
	border-color:transparent #111;
	border-style:solid;
	border-width:4px 0 4px 6px;
	margin:0 .5em 0 0;
}
.list-2 li:before{
	content:"";
	display:inline-block;
	width:8px;
	height:8px;
	border-radius:4px;
	margin:0 .5em 1px 0;
	background:#ff0000;
}

3. Selecting ODD or EVEN Rows in a HTML table or List Items in CSS
	tr:nth-child(odd){your css goes here}
	 tr:nth-child(even){your css goes here}
	li:nth-child(2n){your css goes here}[Here 2n== Even]
	li:nth-child(2n+1){your css goes here}