float demo done.

Author: mikeckennedy

days/013-016-css-basics/demos/selectorville/float.html

@@ -22,11 +22,14 @@
 <div>
     <div id="top-div">
         <img src="static/img/dunecat.jpg" alt="">
-        <div>This is a message</div>
+        <div class="msg">This is a message</div>
+        <div style="clear: both;"></div>
     </div>
 
     <div class="page-content">
 
+        <p><a href="index.html">&#171; home</a></p>
+
         <p>
             Lorem ipsum dolor amet bushwick banh mi irony sustainable twee slow-carb whatever iPhone austin kale chips vegan
             meh flannel sartorial crucifix. Lyft ramps biodiesel asymmetrical offal, four dollar toast succulents meggings
@@ -51,7 +54,6 @@
             Content via <a href="https://hipsum.co">Hipster Ipsum</a>
         </p>
 
-        <p><a href="index.html">&#171; home</a></p>
 
     </div>
 

days/013-016-css-basics/demos/selectorville/static/css/float.css

@@ -4,13 +4,23 @@ body {
     padding: 0;
 }
 
+#top-div img {
+    float: right;
+    height: 96px;
+}
+
 #top-div {
     background-color: #222;
     color: white;
     font-size: 48px;
     padding: 10px;
 }
 
+#top-div .msg {
+    margin-top: 12px;
+    margin-left: 10px;
+}
+
 a {
     font-weight: bold;
 }