求助，上一节的作业做的不好，logo和导航点击效果做不出来，求帮忙修改

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title></title>
  <style type="text/css">
    /*此处写代码*/
    body, div, ul, li {
    	padding: 0;
    	margin: 0;
    	font-size: 24px;
    	font-family: 'Microsoft Yahei';
    }

    .container {
    	max-width: 1100px;
    	height: 100px;
    	background: #000;
    	position: absolute;
    	top: 50%;
    	left: 50%;
    	margin-left: -550px;
    	margin-top: -50px;

    }

    img {
    	cursor: pointer;
    }

    .nav {
    	display: inline-block;
    	width: 800px;
    	height: 100px;
    }

    .nav ul {
    	list-style-type: none;
		position: absolute;
		top:0;
		right: 10px;

    }

    .nav ul li {
		display: inline-block;
		float: left;
		text-align: center;
		line-height: 100px;
		padding: 0 34px;
		cursor: pointer;
    }

    ul li a {
    	text-decoration: none;
    	color: #fff;;
    }

     ul li:hover {
    	background: #14191e;
    }
  </style>
</head>
<body>
  <!-- 此处写代码 -->
  <div class="container">
      <img src="http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png" alt="" >
      <div class="nav">
		 <ul>
			<li><a href="#">课程</a></li>
			<li><a href="#">职业路径</a></li>
			<li><a href="#">实战</a></li>
			<li><a href="#">袁问</a></li>
			<li><a href="#">手记</a></li>
		 </ul>
      </div>
  </div>
</body>
</html>

帮忙看看啊，我写的有问题啊

highcker 2017-07-14

源自：CSS网页布局基础 2-5 经典的行布局（2）