CSS Variables

You can make global variables using :root Here you can declare inside :root --color: rgb(values) formatted syntax
And make use of it in anywhere inside the document with the var("variable name") format.

These are the global variables,
For local variables define it inside a class defination or id defination

These variables can hold anything ranging from colors to display values etc.

Media Query

Long ago we used to have media rule in CSS2
Where the rule was laid for style to be selected based on the device
From CSS3 we began calling it media query

  
  
  
  
  
  
  @media only screen and (max-width:455px) {
    body{
      background-color: blue;
    }
    .boxes{
      flex-direction:column;
    }
}

This is only applicable when the media query / rule is written after the default one
and

  
<meta name="viewport" content="width=device-width, initial-scale=1.0">
  
  is applied so that the browser render understands that the viewport's content width would be equal to device-width [ relevance ] and its scaled would be default 

  i.e 1.0 [no scaling].

Float

Makes the element float to the specified side when some other element wants to takes its place.

Clear

Clears all the elements from the specified side of the element.
You can also use both as a keyword to clear from both sides [ laterally ]. Next