Please someboyd help me!

Hey guys, this is a pretty simple fix, i’m just new to CSS, I have been working on this for hours and cant do it.

[CENTER]CSS


<style type="text/css">	
			body {
				overflow-y:scroll;
				overflow-x:hidden;
				margin-top:0px;
				margin-right:15%;
				margin-bottom:0px;
				margin-left:15%; }
			</style>
			<style type="text/css">		
			a {
				text-decoration:none}
			#nav {
				position:absolute;
				margin-left:100px;
				margin-right:auto;
				text-align:center;
				width:400px;}
			ul.nav {
				text-align: middle;
				width:1100px;
				float:left;
				margin:0 0 3em 0;
				padding:0;
				list-style:none; }
			#nav li {
				float:left; }
			#nav {
				padding-right:50%;
				padding-left:50%;
				width:1000px;
				float:left;
				margin:0 0 3em 0;
				padding:0;
				list-style:none;
				background-color:#ffffff;
				border-bottom:1px solid #0c00ff;
				border-top:1px solid #ffffff; }
			#nav li a {
				display:block;
				padding:8px 50px;
				text-decoration:none;
				font-size:18px;
				font-weight:bold;
				color:#000000;
				border-right:1px solid #ffffff; }
			#nav li a:hover {
				color:#0c00ff;
				background-color:#ffffff; }
		</style>

HTML[/CENTER]

<ul id="nav">
			<li><a href="1">1</a></li>
			<li><a href="2">2</a></li>
			<li><a href="3">3</a></li>
			<li><a href="4">4</a></li>
		</ul>

I’m trying to center the text in the middle of my nav bar, can someone help me?

have a look at this example