CSS Tutorial – 20 – Classification Properties


The classification properties lets us specify
how an element is displayed and whether it’s visible or not.
We have a property for making elements float on top of other elements and another to clear
areas from these floating elements. Then there’s the cursor property for changing
which pointer to use when hovering over an element. The display property determines how a browser
treats the invisible boxes that surround every element. It allows us to make any element
appear as either inline, block, or any other type. By default an image is displayed as an inline
element, meaning it can appear inline with text. With the display property we can change
that and make it appear as a block element instead. The image will then get an invisible
box expanding horizontally, as if there were line breaks before and after the element.
Another important value is none, which completely hides an element along with its space. The visibility property can hide an element
by setting it to hidden without removing the space.
The collapse value renders the same, except when it’s used on table elements. It will
then collapse the hidden area and make it available to other content. Float detaches the element from its containing
element and makes it float on top of it, either to the left or right side.
We can use the clear property to clear floating elements – from the left, right, or both sides
of another element. Cursor specifies what cursor to use when hovering
an element. The default is auto, meaning the browser will decide the cursor. We can also
use our own custom cursor. In case this cursor isn’t available we should list a generic cursor
after it.

Add a Comment

Your email address will not be published. Required fields are marked *