Menubar никак не становиться горизонтальным, как исправить?

Курс html/css 34урок.нужна помощ

Написал код точно так же как у автора!Но menubar никак не становиться горизонтальным.В итоге скопировал весь файл автора,но все без толку!Menubar такой-же вертикальный.Может ли это быть из-за моего редактора?Я использую Atom.Если кто знает в чем проблема прошу помоч.

* {
 margin: 0;
 padding: 0;
}

.header {
 background-color: darkslateblue;
 height: 177px;
 font-size: 0.8em;
 margin-left: 0px;
 margin-right: 0px;
 min-width: 900px;
}

.main, .logo, .menubar, .site_content, .footer {
 margin-left: auto;
 margin-right: auto;
}

.logo {
 width: 880px;
 padding-bottom: 40px;
}

.logo h1, .logo h2 {
 font: normal 300% 'century gothic', arial, sans-serif;
 margin: 0 0 0 9px;
}

.logo_text h1, .logo_text h1 a, .logo_text h1 a:hover {
 padding: 22px 0 0 0;
 color: #fff;
 letter-spacing: 0.1em;
 text-decoration: none;
}

.logo_text h2 {
 font-size: 0.9em;
 padding: 4px 0 0 0;
 color: #999;
}

.menubar {
 width: 900px;
 height: 46px;
}

.menu {
 float: right;
}

ul.menu li {
 float: left;
 padding: 0 0 0 9px;
 list-style: none;
 margin: 1px 2px 0 0;
}

ul.menu li a {
 font: normal 100% 'trebuchet ms', sans-serif;
 display: block;
 height: 20px;
 padding: 6px 35px 5px 28px;
 color: #fff;
 text-decoration: none;
}

ul.menu li.selected a {
 color: #aeb002;
}

ul.menu li a:hover {
 color: #e4ec04;
}