Css html5教程>；30设置默认和进度条的样式是否奇怪？

我使用了与Newboston Html5教程第30类完全相同的代码。但我不明白为什么#defaultBar和#progressBar脱离了皮肤。作为教程，他们应该在皮肤内部（我使用chrome）。我犯了什么错误？请帮忙

这是教程链接

将其添加到CSS:）这是因为浮动

nav:：after{
明确：两者皆有；
}

我改变了这三个元素的属性，现在看起来好像工作了。
我在睡觉的时候想了一整晚，我找到了一个方法来修复它。那就是把导航变成一个盒子。把#按钮和#进度条放在里面
我不知道为什么Bucky的代码在我的笔记本电脑中不起作用，但我认为只要看起来一样就可以了。希望对其他困在30班的同学有所帮助