div element of the newRow class Question

The question: Next, you'll create the style rules for the grid section of the March Specials page. Go to the Row Styles section. For every div element of the newRow class, create a style rule that displays the element with a width of 100% and only when all floated elements have been cleared. Using the technique from this tutorial, add another style rule that uses after pseudo-element to expand each newRow class of the div element around its floating columns.

Next, you'll format grid columns. Go to the Column Styles section. Create a style rule to float all div elements whose class value starts with "col" on the left margin. Set the padding around all such elements to 2%. Finally, apply the Border Box Sizing model to the content of those elements. (Note: Remember to use web extensions to provide support for older browsers.)

I'm not sure what I'm doing wrong. Below is my css code for the page so far:

/* Page Body Styles */

body { width: 95%; max-width: 960px; min-width: 640px; margin-left: auto; margin-right: auto; }

/* Image Styles */

body > header > img { display: block; width: 100%; }

/* Horizontal Navigation Styles */

body > header > nav.horizontalNavigation li { width: 16.66%; }

nav.horizontalNavigation li { display: block; float: left; }

nav.horizontalNavigation a { display: block; }

/* Row Styles */

.div::after newRow { clear: both; width: 100%; }

/* Column Styles */

div { float: left; padding: 2%; box-sizing: border-box; }