Issue title: SearchBox component not rendering properly
 Issue body: ```
import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox'
...
<div>
<SearchBox/>
</div>
...
```

<img width="790" alt="screen shot 2016-09-28 at 3 48 41 pm" src="https://cloud.githubusercontent.com/assets/1192312/18929584/17276ff6-8593-11e6-9ec8-625af71de6b9.png">

<img width="801" alt="screen shot 2016-09-28 at 3 48 48 pm" src="https://cloud.githubusercontent.com/assets/1192312/18929590/1d098d00-8593-11e6-9226-f80fef613bb9.png">



 Comments: 
 Comment 0: Does your html tag have a `dir="ltr"` attribute? I believe this may be because this is missing.

If you wrap your app content in the "Fabric" component, it will address this for you. It will also show/hide keyboard focus rect styling when the user interacts with the keyboard navigation keys.


 Comment 1: Thanks that works. Would be great if that were in the documentation ;)
Also a requirement is to link the fabric.css file otherwise none of the <i> icons render.
 Comment 2: Cool. Thanks for letting us know.

Covered both issues here: https://github.com/OfficeDev/office-ui-fabric-react/issues/351

{'source': 'GithubIssues', 'repo_name_with_owner': 'OfficeDev/office-ui-fabric-react', 'issue_id': 179870754, 'repo_stars': 7044.0}