The following section below first discusses how to use pseudo-classes and pseudo-elements. After this, the float and clear properties are discussed. This webpage provides examples of each of these topics.
Pseudo-classes and pseudo-elements are both used to edit the behavior of specific parts or scenarios of an element. Pseudo-classes specify a certain state of an element, and are implemented by inserting a colon after the element class, followed by any of the predefined pseudo-class names in CSS. Pseudo-elements specify a certain part of an element, and are implemented by inserting two colons after the element class, followed by any of the predefined pseudo-element names in CSS. The webpage link in the header of this report features the hover pseudo-class to highlight the paragraphs of text below the headers. In addition to this, the pseudo-element after is used on that page to display the image on floating on the right side within the div box better. There are many more pseudo-classes and pseudo-elements that can be used to specify other parts of an element or element state.
Float and clear are properties used to position elements on the page more specifically. Float allows you to place an element on the left or right, and clear allows you to modify the position of an element following a float element. By default, an element will have its float value set to none, meaning the element will appear where it occurs in the text. Right and left float the element to the right or left of the container, and inherit will cause the element to inherit the float value of the parent element. Clear has the same values as float in addition to value both--indicating that this element should be placed below both right or left floating elements. The webpage linked in the header features aside boxes that are floated to the right, as well as empty space under the image in the div box towards the top to ensure that the content is spaced well.