css absolute center horizontal

1.child {
2    position: absolute;
3    top: 50%;  
4    left: 50%; 
5    transform: translate(-50%, -50%);
6}

1.parent{  position: relative;}.child{  position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);}

1position: absolute;
2margin-left: auto;
3margin-right: auto;
4left: 0;
5right: 0;
6text-align: center;

1position: absolute;
2margin-left: auto;
3margin-right: auto;
4left: 0;
5right: 0;

1#content {
2  position: absolute; 
3  left: 0; 
4  right: 0; 
5  margin-left: auto; 
6  margin-right: auto; 
7  width: 100px; /* Need a specific value to work */
8}

1// center horizontal 
2
3.product-item-div {
4	position: relative;
5}
6
7.sold_out {
8	position: absolute;
9	padding: 6px;
10	top: 180px;
11	left: 50%;
12	transform: translate(-50%, -50%);
13	background-color: @wishlist-grey;
14	color: white;
15	border-radius: 5px;
16}
17
18
19
20
21// center vertical 
22
23.product-item-div {
24	position: relative;
25}
26
27.sold_out {
28	position: absolute;
29	padding: 6px;
30	top: 50%;	/* fix here */
31	left: 50%;
32	transform: translate(-50%, -50%);
33	background-color: @wishlist-grey;
34	color: white;
35	border-radius: 5px;
36}