HTML and CSS Reference
In-Depth Information
Click here to view code image
1. /*
2. ========================================
3. Clearfix
4. ========================================
5. */
6.
7. .group:before,
8. .group:after {
9. content: "";
10. display: table;
11. }
12. .group:after {
13. clear: both;
14. }
15. .group {
16. clear: both;
17. *zoom: 1;
18. }
2. Now that we can contain floats, let's float the primary <h1> within the <head-
er> element to the left and allow all of the other content in the header to wrap to
the right of it.
To do this, let's add a class of logo to the <h1> element. Then within our CSS,
let's add a new section of styles for the primary header. In this section we'll select
the <h1> element with the logo class and then float it to the left.
HTML
Click here to view code image
1. <h1 class="logo" >
2. <a href="index.html">Styles Conference</a>
3. </h1>
CSS
Click here to view code image
1. /*
2. ========================================
3. Primary header
4. ========================================
5. */
6.
7. .logo {
8. float: left;
9. }
Search WWH ::




Custom Search