Print this chapterPrint this chapter

Basics of CSS Float

4. Summary


  • Elements that seem to float on the right or left side of either the browser window or another element are often configured using float property. The browser renders these elements using normal flow and then shifts them to either the right or left as far as possible within their container (usually either the browser viewport or a div element).
  • Use float: right; to flow the element on the right side of the container.
  • Use float: left; to float the element on the left side of the container.
  • Other elements and web page content will flow around the floated element.
References

Terry Felke-Morris(2015). Page Layout. In Terry Felke-Morris (Seventh Edition), Web Development and Design Foundations with HTML5 (267-312). England, Pearson

Jacob Jenkov (2019, June 03) CSS Float. Retrieve from https://www.tutorials.jenkov.com/css/ float.html#pageToc

Jennifer Niederst Robbins (2012). Floating and Positioning. In Jennifer Niederst Robbins (4th Edition), Learning Web Design A Beginner’s Guide to HTML, CSS, JavaScript, and Web Graphics (341-371). Canada, O’Reilly Media, Inc.