:nth-child & :nth-of-type

.first span:nth-child(2n+1),

.second span:nth-child(2n+1), 

.third span:nth-of-type(2n+1) { 

background-color: lime; 

}

@reference_0

--------------------
Responsive Table
A responsive table will display a horizontal scroll bar if the screen is too small to display the full content.

Add a container element (like <div>) with overflow-x:auto around the <table> element to make it responsive:

<div style="overflow-x:auto;">
<table>
... table content ...
</table>
</div>

@reference_1

------------------------
display: block;
display: inline;
display: none;
visibility: hidden;
@reference_2

position: static;

position: relative;
position: fixed;
position: absolute;

An element with position: absolute; is positioned relative to the nearest positioned ancestor (instead of positioned relative to the viewport, like fixed).
However; if an absolute positioned element has no positioned ancestors, it uses the document body, and moves along with page scrolling.
Note: A "positioned" element is one whose position is anything except static.
@reference_3