\documentclass[10pt,a4paper]{article}

% Packages
\usepackage{fancyhdr}           % For header and footer
\usepackage{multicol}           % Allows multicols in tables
\usepackage{tabularx}           % Intelligent column widths
\usepackage{tabulary}           % Used in header and footer
\usepackage{hhline}             % Border under tables
\usepackage{graphicx}           % For images
\usepackage{xcolor}             % For hex colours
%\usepackage[utf8x]{inputenc}    % For unicode character support
\usepackage[T1]{fontenc}        % Without this we get weird character replacements
\usepackage{colortbl}           % For coloured tables
\usepackage{setspace}           % For line height
\usepackage{lastpage}           % Needed for total page number
\usepackage{seqsplit}           % Splits long words.
%\usepackage{opensans}          % Can't make this work so far. Shame. Would be lovely.
\usepackage[normalem]{ulem}     % For underlining links
% Most of the following are not required for the majority
% of cheat sheets but are needed for some symbol support.
\usepackage{amsmath}            % Symbols
\usepackage{MnSymbol}           % Symbols
\usepackage{wasysym}            % Symbols
%\usepackage[english,german,french,spanish,italian]{babel}              % Languages

% Document Info
\author{TomDesign (tomdesign)}
\pdfinfo{
  /Title (html5-basics-test.pdf)
  /Creator (Cheatography)
  /Author (TomDesign (tomdesign))
  /Subject (HTML5 Basics test Cheat Sheet)
}

% Lengths and widths
\addtolength{\textwidth}{6cm}
\addtolength{\textheight}{-1cm}
\addtolength{\hoffset}{-3cm}
\addtolength{\voffset}{-2cm}
\setlength{\tabcolsep}{0.2cm} % Space between columns
\setlength{\headsep}{-12pt} % Reduce space between header and content
\setlength{\headheight}{85pt} % If less, LaTeX automatically increases it
\renewcommand{\footrulewidth}{0pt} % Remove footer line
\renewcommand{\headrulewidth}{0pt} % Remove header line
\renewcommand{\seqinsert}{\ifmmode\allowbreak\else\-\fi} % Hyphens in seqsplit
% This two commands together give roughly
% the right line height in the tables
\renewcommand{\arraystretch}{1.3}
\onehalfspacing

% Commands
\newcommand{\SetRowColor}[1]{\noalign{\gdef\RowColorName{#1}}\rowcolor{\RowColorName}} % Shortcut for row colour
\newcommand{\mymulticolumn}[3]{\multicolumn{#1}{>{\columncolor{\RowColorName}}#2}{#3}} % For coloured multi-cols
\newcolumntype{x}[1]{>{\raggedright}p{#1}} % New column types for ragged-right paragraph columns
\newcommand{\tn}{\tabularnewline} % Required as custom column type in use

% Font and Colours
\definecolor{HeadBackground}{HTML}{333333}
\definecolor{FootBackground}{HTML}{666666}
\definecolor{TextColor}{HTML}{333333}
\definecolor{DarkBackground}{HTML}{F99300}
\definecolor{LightBackground}{HTML}{FEF8EF}
\renewcommand{\familydefault}{\sfdefault}
\color{TextColor}

% Header and Footer
\pagestyle{fancy}
\fancyhead{} % Set header to blank
\fancyfoot{} % Set footer to blank
\fancyhead[L]{
\noindent
\begin{multicols}{3}
\begin{tabulary}{5.8cm}{C}
    \SetRowColor{DarkBackground}
    \vspace{-7pt}
    {\parbox{\dimexpr\textwidth-2\fboxsep\relax}{\noindent
        \hspace*{-6pt}\includegraphics[width=5.8cm]{/web/www.cheatography.com/public/images/cheatography_logo.pdf}}
    }
\end{tabulary}
\columnbreak
\begin{tabulary}{11cm}{L}
    \vspace{-2pt}\large{\bf{\textcolor{DarkBackground}{\textrm{HTML5 Basics test Cheat Sheet}}}} \\
    \normalsize{by \textcolor{DarkBackground}{TomDesign (tomdesign)} via \textcolor{DarkBackground}{\uline{cheatography.com/121455/cs/22231/}}}
\end{tabulary}
\end{multicols}}

\fancyfoot[L]{ \footnotesize
\noindent
\begin{multicols}{3}
\begin{tabulary}{5.8cm}{LL}
  \SetRowColor{FootBackground}
  \mymulticolumn{2}{p{5.377cm}}{\bf\textcolor{white}{Cheatographer}}  \\
  \vspace{-2pt}TomDesign (tomdesign) \\
  \uline{cheatography.com/tomdesign} \\
  \end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}}  \\
   \vspace{-2pt}Not Yet Published.\\
   Updated 1st April, 2020.\\
   Page {\thepage} of \pageref{LastPage}.
\end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Sponsor}}  \\
  \SetRowColor{white}
  \vspace{-5pt}
  %\includegraphics[width=48px,height=48px]{dave.jpeg}
  Measure your website readability!\\
  www.readability-score.com
\end{tabulary}
\end{multicols}}




\begin{document}
\raggedright
\raggedcolumns

% Set font size to small. Switch to any value
% from this page to resize cheat sheet text:
% www.emerson.emory.edu/services/latex/latex_169.html
\footnotesize % Small font.

\begin{multicols*}{3}

\begin{tabularx}{5.377cm}{x{1.89126 cm} x{3.08574 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Structure of the document}}  \tn
% Row 0
\SetRowColor{LightBackground}
\textless{}!DOCTYPE\textgreater{} & (X) HTML version \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\textless{}html\textgreater{} & HTML document \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textless{}head\textgreater{} & Page information \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\textless{}body\textgreater{} & Page content \tn 
% Row Count 4 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{1.59264 cm} x{3.38436 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Page information}}  \tn
% Row 0
\SetRowColor{LightBackground}
\textless{}title\textgreater{} & Page title \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\textless{}meta /\textgreater{} & Metadata \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textless{}base /\textgreater{} & Base address \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\textless{}link /\textgreater{} & External resource \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\textless{}style\textgreater{} & Defining styles \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
\textless{}script\textgreater{} & Defining scripts \tn 
% Row Count 6 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{1.14471 cm} x{3.83229 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Structure tags}}  \tn
% Row 0
\SetRowColor{LightBackground}
\textless{}div\textgreater{} & Block envelope \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\textless{}span\textgreater{} & Chain envelope \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textless{}section\textgreater{} & Section \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\textless{}nav\textgreater{} & Navigation \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\textless{}header\textgreater{} & Header \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
\textless{}footer\textgreater{} & Footer \tn 
% Row Count 6 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\textless{}article\textgreater{} & Article \tn 
% Row Count 7 (+ 1)
% Row 7
\SetRowColor{white}
\textless{}aside\textgreater{} & Associated / secondary content \tn 
% Row Count 8 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{2.04057 cm} x{2.93643 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Text formatting}}  \tn
% Row 0
\SetRowColor{LightBackground}
\textless{}h {[}1-6{]}\textgreater{} & Title levels \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\textless{}p\textgreater{} & Paragraph \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textless{}br/\textgreater{} or \textless{}br\textgreater{} & Line break \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\textless{}strong\textgreater{} & Bold (SEO) \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\textless{}b\textgreater{} & Bold \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
\textless{}em\textgreater{} & Italicization (SEO) \tn 
% Row Count 6 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\textless{}i\textgreater{} & Italicized \tn 
% Row Count 7 (+ 1)
% Row 7
\SetRowColor{white}
\textless{}blockquote\textgreater{} & External quote \tn 
% Row Count 8 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\textless{}mark\textgreater{} & Highlight \tn 
% Row Count 9 (+ 1)
% Row 9
\SetRowColor{white}
\textless{}pre\textgreater{} & Pre-formatted text \tn 
% Row Count 10 (+ 1)
% Row 10
\SetRowColor{LightBackground}
\textless{}code\textgreater{} & Coded \tn 
% Row Count 11 (+ 1)
% Row 11
\SetRowColor{white}
\textless{}address\textgreater{} & Address \tn 
% Row Count 12 (+ 1)
% Row 12
\SetRowColor{LightBackground}
\textless{}cite\textgreater{} & Quote \tn 
% Row Count 13 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{\{\{fa-code\}\} Picture Test}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{p{5.377cm}}{\vspace{1px}\centerline{\includegraphics[width=5.1cm]{/web/www.cheatography.com/public/uploads/tomdesign_1585745736_Sans-titre---2.png}}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Page information}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{5.377cm}}{hello how are you ?} \tn 
\mymulticolumn{1}{x{5.377cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}I'm fine thx!} \tn 
% Row Count 2 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{2.05965 cm} x{2.01388 cm} p{0.50347 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{Picture Test}}  \tn
% Row 0
\SetRowColor{white}
\textless{}body\textgreater{} & \hspace*{0.02 cm}\rule{2.02cm}{6px} & 60 \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{2.28942 cm} x{2.68758 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Links}}  \tn
% Row 0
\SetRowColor{LightBackground}
\textless{}a href=""\textgreater{} & Link to a URL or file \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\textless{}a href="mailto:"\textgreater{} & Link to an email \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textless{}a name=""\textgreater{} & Anchor \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\textless{}a href="\#name"\textgreater{} & Link to an anchor \tn 
% Row Count 4 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{p{0.4977 cm} p{0.4977 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Tables}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{} \tn 
% Row Count 0 (+ 0)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Picture Test}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{p{5.377cm}}{\vspace{1px}\centerline{\includegraphics[width=5.1cm]{/web/www.cheatography.com/public/uploads/}}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{5.377cm}}{`\textless{}html\textgreater{} \newline  \textless{}head\textgreater{} \newline  \textless{}title\textgreater{}Titre de la page\textless{}/title\textgreater{} \newline  \textless{}meta charset="UTF-8" /\textgreater{} \newline  \textless{}/head\textgreater{} \newline  \textless{}body\textgreater{} \newline  \textless{}header\textgreater{} \newline  \textless{}nav\textgreater{}\textless{}/nav\textgreater{} \newline  \textless{}/header\textgreater{} \newline  \textless{}section\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  ... \newline  \textless{}/section\textgreater{} \newline  \textless{}aside\textgreater{}\textless{}/aside\textgreater{} \newline  \textless{}footer\textgreater{}\textless{}/footer\textgreater{} \newline  \textless{}/body\textgreater{}`}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Page information}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{p{5.377cm}}{\vspace{1px}\centerline{\includegraphics[width=5.1cm]{/web/www.cheatography.com/public/uploads/}}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{5.377cm}}{\textless{}html\textgreater{} \newline  \textless{}head\textgreater{} \newline  \textless{}title\textgreater{}Titre de la page\textless{}/title\textgreater{} \newline  \textless{}meta charset="UTF-8" /\textgreater{} \newline  \textless{}/head\textgreater{} \newline  \textless{}body\textgreater{} \newline  \textless{}header\textgreater{} \newline  \textless{}nav\textgreater{}\textless{}/nav\textgreater{} \newline  \textless{}/header\textgreater{} \newline  \textless{}section\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  ... \newline  \textless{}/section\textgreater{} \newline  \textless{}aside\textgreater{}\textless{}/aside\textgreater{} \newline  \textless{}footer\textgreater{}\textless{}/footer\textgreater{} \newline  \textless{}/body}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Links}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{5.377cm}}{} \tn 
% Row Count 0 (+ 0)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{\{\{fa-beer\}\} Picture Test}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{p{5.377cm}}{\vspace{1px}\centerline{\includegraphics[width=5.1cm]{/web/www.cheatography.com/public/uploads/}}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{5.377cm}}{\textless{}html\textgreater{} \newline  \textless{}head\textgreater{} \newline  \textless{}title\textgreater{}Titre de la page\textless{}/title\textgreater{} \newline ` \textless{}meta charset="UTF-8" /\textgreater{}` \newline  \textless{}/head\textgreater{} \newline  \textless{}body\textgreater{} \newline  \textless{}header\textgreater{} \newline  \textless{}nav\textgreater{}\textless{}/nav\textgreater{} \newline  \textless{}/header\textgreater{} \newline  \textless{}section\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  ... \newline  \textless{}/section\textgreater{} \newline  \textless{}aside\textgreater{}\textless{}/aside\textgreater{} \newline  \textless{}footer\textgreater{}\textless{}/footer\textgreater{} \newline  \textless{}/body}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{\{\{fa-beer\}\} Picture Test}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{p{5.377cm}}{\vspace{1px}\centerline{\includegraphics[width=5.1cm]{/web/www.cheatography.com/public/uploads/tomdesign_1585742591_Sans-titre---2.png}}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{5.377cm}}{`\textless{}html\textgreater{}` \newline -{}-{}- `\textless{}head\textgreater{}` \newline -{}-{}-{}-{}-{}- `\textless{}title\textgreater{}Titre de la page\textless{}/title\textgreater{}` \newline -{}-{}-{}-{}-{}- `\textless{}meta charset="UTF-8" /\textgreater{}` \newline -{}-{}- `\textless{}/head\textgreater{}` \newline -{}-{}- `\textless{}body\textgreater{}` \newline -{}-{}-{}-{}-{}- `\textless{}header\textgreater{}` \newline -{}-{}-{}-{}-{}-{}-{}-{}- `\textless{}nav\textgreater{}\textless{}/nav\textgreater{}` \newline -{}-{}-{}-{}-{}- `\textless{}/header\textgreater{}` \newline -{}-{}-{}-{}-{}- `\textless{}section\textgreater{}` \newline -{}-{}-{}-{}-{}-{}-{}-{}- `\textless{}article\textgreater{}\textless{}/article\textgreater{}` \newline -{}-{}-{}-{}-{}-{}-{}-{}- `\textless{}article\textgreater{}\textless{}/article\textgreater{}` \newline -{}-{}-{}-{}-{}-{}-{}-{}- `\textless{}article\textgreater{}\textless{}/article\textgreater{}` \newline -{}-{}-{}-{}-{}- `\textless{}/section\textgreater{}` \newline -{}-{}-{}-{}-{}- `\textless{}aside\textgreater{}\textless{}/aside\textgreater{}` \newline -{}-{}-{}-{}-{}- `\textless{}footer\textgreater{}\textless{}/footer\textgreater{}` \newline -{}-{}- `\textless{}/body\textgreater{}` \newline `\textless{}/html\textgreater{}`}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Picture Test}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{p{5.377cm}}{\vspace{1px}\centerline{\includegraphics[width=5.1cm]{/web/www.cheatography.com/public/uploads/tomdesign_1585740902_Sans-titre---2.png}}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{test}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{p{5.377cm}}{\vspace{1px}\centerline{\includegraphics[width=5.1cm]{/web/www.cheatography.com/public/uploads/tomdesign_1585741253_Sans-titre---2.png}}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{5.377cm}}{Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Page information}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{5.377cm}}{\textless{}html\textgreater{} \newline  \textless{}head\textgreater{} \newline  \textless{}title\textgreater{}Titre de la page\textless{}/title\textgreater{} \newline  \textless{}meta charset="UTF-8" /\textgreater{} \newline  \textless{}/head\textgreater{} \newline  \textless{}body\textgreater{} \newline  \textless{}header\textgreater{} \newline  \textless{}nav\textgreater{}\textless{}/nav\textgreater{} \newline  \textless{}/header\textgreater{} \newline  \textless{}section\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  \textless{}article\textgreater{}\textless{}/article\textgreater{} \newline  ... \newline  \textless{}/section\textgreater{} \newline  \textless{}aside\textgreater{}\textless{}/aside\textgreater{} \newline  \textless{}footer\textgreater{}\textless{}/footer\textgreater{} \newline  \textless{}/body} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Test}}  \tn
\SetRowColor{white}
\mymulticolumn{1}{x{5.377cm}}{\textless{}div style="padding: 3px 8px;"\textgreater{}\<html\>\textless{}br\textgreater{} \newline % Row Count 1 (+ 1)
~\<head\>\textless{}br\textgreater{} \newline % Row Count 2 (+ 1)
~\<title\>Titre de la page\</title\>\textless{}br\textgreater{} \newline % Row Count 4 (+ 2)
~\<meta charset="UTF-8" /\>\textless{}br\textgreater{} \newline % Row Count 5 (+ 1)
~\</head\>\textless{}br\textgreater{} \newline % Row Count 6 (+ 1)
~\<body\>\textless{}br\textgreater{} \newline % Row Count 7 (+ 1)
~\<header\>\textless{}br\textgreater{} \newline % Row Count 8 (+ 1)
~\<nav\>\</nav\>\textless{}br\textgreater{} \newline % Row Count 9 (+ 1)
~\</header\>\textless{}br\textgreater{} \newline % Row Count 10 (+ 1)
~\<section\>\textless{}br\textgreater{} \newline % Row Count 11 (+ 1)
~\<article\>\</article\>\textless{}br\textgreater{} \newline % Row Count 12 (+ 1)
~\<article\>\</article\>\textless{}br\textgreater{} \newline % Row Count 13 (+ 1)
~\<article\>\</article\>\textless{}br\textgreater{} \newline % Row Count 14 (+ 1)
~...\textless{}br\textgreater{} \newline % Row Count 15 (+ 1)
~\</section\>\textless{}br\textgreater{} \newline % Row Count 16 (+ 1)
~\<aside\>\</aside\>\textless{}br\textgreater{} \newline % Row Count 17 (+ 1)
~\<footer\>\</footer\>\textless{}br\textgreater{} \newline % Row Count 18 (+ 1)
~\</body\textless{}/div\textgreater{}% Row Count 19 (+ 1)
} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{\{\{fa-beer\}\} Picture Test}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{p{5.377cm}}{\vspace{1px}\centerline{\includegraphics[width=5.1cm]{/web/www.cheatography.com/public/uploads/tomdesign_1585744472_Sans-titre---2.png}}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{\{\{fa-beer\}\} Picture Test}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{p{5.377cm}}{\vspace{1px}\centerline{\includegraphics[width=5.1cm]{/web/www.cheatography.com/public/uploads/tomdesign_1585744935_Sans-titre---2.png}}} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}


% That's all folks
\end{multicols*}

\end{document}