div centered around different screen resolution down

method one:

		div{
			    position:absolute;
				width: 200px;
				height:200px;
				background:red;
				top:50%;
				left:50%;
				margin-left:-100px;
				margin-top:-100px;
			}

Method Two:

			div{
			   		position:absolute;
					width: 200px;
					height:200px;
					background:red;
					top: 0;
					left: 0;
					bottom: 0;
					right: 0;
			 		margin:auto;
			}

Method three:

		div {
			    position:absolute;
				width: 200px;
				height:200px;
				background:red;
				top:50%;
				left:50%;
				transform:translate(-50%,-50%);
			} 

Method four:

	div{
		position:absolute;
		width: 200px;
		height:200px;
		background:red;
		top: calc((100% - 200px)/2);
		left:calc((100% - 200px)/2);
	}