\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{Vladislav} \pdfinfo{ /Title (materialize.pdf) /Creator (Cheatography) /Author (Vladislav) /Subject (Materialize 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}{A35858} \definecolor{LightBackground}{HTML}{F9F4F4} \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{Materialize Cheat Sheet}}}} \\ \normalsize{by \textcolor{DarkBackground}{Vladislav} via \textcolor{DarkBackground}{\uline{cheatography.com/39558/cs/12282/}}} \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}Vladislav \\ \uline{cheatography.com/vladislav} \\ \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 13th July, 2017.\\ 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{2.38896 cm} x{2.58804 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Color}} \tn % Row 0 \SetRowColor{LightBackground} red pink purple & deep-purple indigo blue \tn % Row Count 2 (+ 2) % Row 1 \SetRowColor{white} light-blue cyan teal & green light-green lim \tn % Row Count 4 (+ 2) % Row 2 \SetRowColor{LightBackground} yellow amber orange & deep-orange brown grey \tn % Row Count 6 (+ 2) % Row 3 \SetRowColor{white} blue-gray black white & transparent \tn % Row Count 8 (+ 2) % Row 4 \SetRowColor{LightBackground} \{\{bt\}\}lighten-{[}1-4{]} & \{\{bt\}\}darken-{[}1-4{]} \tn % Row Count 9 (+ 1) % Row 5 \SetRowColor{white} \mymulticolumn{2}{x{5.377cm}}{accent-{[}1-4{]}} \tn % Row Count 10 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{for text: \newline {[}color{]}-text \newline and/or \newline text-{[}transparancy{]} \newline http://materializecss.com/color.html} \tn \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{1.44333 cm} x{3.53367 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{JS}} \tn % Row 0 \SetRowColor{LightBackground} Carousel & \seqsplit{http://materializecss.com/pagination.html} \tn % Row Count 2 (+ 2) % Row 1 \SetRowColor{white} \seqsplit{Collapsible} & \seqsplit{http://materializecss.com/collapsible.html} \tn % Row Count 4 (+ 2) % Row 2 \SetRowColor{LightBackground} Dialogs & \seqsplit{http://materializecss.com/dialogs.html} \tn % Row Count 6 (+ 2) % Row 3 \SetRowColor{white} Dropdown & \seqsplit{http://materializecss.com/dropdown.html} \tn % Row Count 8 (+ 2) % Row 4 \SetRowColor{LightBackground} \seqsplit{FeatureDiscovery} & \seqsplit{http://materializecss.com/feature-discovery.html} \tn % Row Count 10 (+ 2) % Row 5 \SetRowColor{white} Media & \seqsplit{http://materializecss.com/media.html} \tn % Row Count 12 (+ 2) % Row 6 \SetRowColor{LightBackground} Modals & \seqsplit{http://materializecss.com/modals.html} \tn % Row Count 14 (+ 2) % Row 7 \SetRowColor{white} Parallax & \seqsplit{http://materializecss.com/parallax.html} \tn % Row Count 16 (+ 2) % Row 8 \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{etc} \tn % Row Count 17 (+ 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}{Icons}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{\textless{}i class="material-icons"\textgreater{}add\textless{}/i\textgreater{}} \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{\textless{}i class="large material-icons"\textgreater{}insert\_chart\textless{}/i\textgreater{}} \tn % Row Count 2 (+ 1) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{tiny small medium large} \tn % Row Count 3 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}-} \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{\textless{}link \seqsplit{href="https://fonts.googleapis.com/icon?family=Material+Icons"} rel="stylesheet"\textgreater{} \newline http://materializecss.com/icons.html} \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{2.58804 cm} x{2.38896 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Sass}} \tn % Row 0 \SetRowColor{LightBackground} \_variables.scss & animation(\$args) \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} \seqsplit{animation-delay(\$delay)} & \seqsplit{animation-direction(\$direction)} \tn % Row Count 3 (+ 2) % Row 2 \SetRowColor{LightBackground} \seqsplit{animation-duration(\$duration)} & \seqsplit{animation-fill-mode(\$mode)} \tn % Row Count 5 (+ 2) % Row 3 \SetRowColor{white} \seqsplit{animation-iteration-count(\$count)} & \seqsplit{animation-name(\$name)} \tn % Row Count 7 (+ 2) % Row 4 \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{...} \tn % Row Count 8 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\seqsplit{http://materializecss.com/sass.html}} \tn \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{2.14011 cm} x{2.83689 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Cards}} \tn % Row 0 \SetRowColor{LightBackground} card & card-content \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} card-title & card-action \tn % Row Count 2 (+ 1) % Row 2 \SetRowColor{LightBackground} card-image & halfway-fab \tn % Row Count 3 (+ 1) % Row 3 \SetRowColor{white} "card horizontal" & card-stacked \tn % Row Count 4 (+ 1) % Row 4 \SetRowColor{LightBackground} card-reveal & sticky-action \tn % Row Count 5 (+ 1) % Row 5 \SetRowColor{white} card-tabs & "tabs tabs-fixed-width" \tn % Row Count 7 (+ 2) % Row 6 \SetRowColor{LightBackground} tab & "card small" \tn % Row Count 8 (+ 1) % Row 7 \SetRowColor{white} \mymulticolumn{2}{x{5.377cm}}{...} \tn % Row Count 9 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\seqsplit{http://materializecss.com/cards.html}} \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}{Grid}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{container} \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{row} \tn % Row Count 2 (+ 1) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{col} \tn % Row Count 3 (+ 1) % Row 3 \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{{[}s,m,l,xl{]}{[}1-12{]} // s12, m6, l3} \tn % Row Count 4 (+ 1) % Row 4 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{offset-*} \tn % Row Count 5 (+ 1) % Row 5 \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{push-*} \tn % Row Count 6 (+ 1) % Row 6 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{pull-* //pull-s4} \tn % Row Count 7 (+ 1) % Row 7 \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{section} \tn % Row Count 8 (+ 1) % Row 8 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{divider} \tn % Row Count 9 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}-} \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{\seqsplit{http://materializecss.com/grid.html}} \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{2.4885 cm} x{2.4885 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Navbar}} \tn % Row 0 \SetRowColor{LightBackground} nav-wrapper & side-nav \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} brand-logo & active \tn % Row Count 2 (+ 1) % Row 2 \SetRowColor{LightBackground} nav-extended & nav-content \tn % Row Count 3 (+ 1) % Row 3 \SetRowColor{white} tabs & tabs-transparent \tn % Row Count 4 (+ 1) % Row 4 \SetRowColor{LightBackground} tab & navbar-fixed \tn % Row Count 5 (+ 1) % Row 5 \SetRowColor{white} dropdown-content & dropdown-button \tn % Row Count 6 (+ 1) % Row 6 \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{side-nav} \tn % Row Count 7 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\seqsplit{http://materializecss.com/navbar.html}} \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}{Forms}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{\seqsplit{http://materializecss.com/forms.html}} \tn % Row Count 1 (+ 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}{Footer}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{\seqsplit{http://materializecss.com/footer.html}} \tn % Row Count 1 (+ 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}{Chips}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{\seqsplit{http://materializecss.com/chips.html}} \tn % Row Count 1 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{p{1.89126 cm} p{3.08574 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Badges}} \tn % Row 0 \SetRowColor{LightBackground} new & badge \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} \mymulticolumn{2}{x{5.377cm}}{brand-logo} \tn % Row Count 2 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\seqsplit{data-badge-caption="custom} caption" \newline http://materializecss.com/badges.html} \tn \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{2.63781 cm} x{2.33919 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Table}} \tn % Row 0 \SetRowColor{LightBackground} bordered & striped \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} highlight & centered \tn % Row Count 2 (+ 1) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{responsive-table} \tn % Row Count 3 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\seqsplit{http://materializecss.com/table.html}} \tn \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{2.33919 cm} x{2.63781 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Media}} \tn % Row 0 \SetRowColor{LightBackground} responsive-img & video-container \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} circle & responsive-video \tn % Row Count 2 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\seqsplit{http://materializecss.com/media-css.html}} \tn \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{1.89126 cm} x{3.08574 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Buttons}} \tn % Row 0 \SetRowColor{LightBackground} btn & btn-floating \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} btn-large & fixed-action-btn \tn % Row Count 2 (+ 1) % Row 2 \SetRowColor{LightBackground} horizontal & click-to-toggle \tn % Row Count 3 (+ 1) % Row 3 \SetRowColor{white} toolbar & btn-flat \tn % Row Count 4 (+ 1) % Row 4 \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{disabled} \tn % Row Count 5 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\textless{}i class="material-icons"\textgreater{}add\textless{}/i\textgreater{} \newline http://materializecss.com/buttons.html} \tn \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{3.18528 cm} x{1.79172 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Transitions}} \tn % Row 0 \SetRowColor{LightBackground} scale-transition & scale-out \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} \mymulticolumn{2}{x{5.377cm}}{scale-out} \tn % Row Count 2 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\seqsplit{http://materializecss.com/css-transitions.html\#}!} \tn \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{2.4885 cm} x{2.4885 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Collections}} \tn % Row 0 \SetRowColor{LightBackground} collection & collection-item \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} active & collection-header \tn % Row Count 2 (+ 1) % Row 2 \SetRowColor{LightBackground} with-header & avatar \tn % Row Count 3 (+ 1) % Row 3 \SetRowColor{white} secondary-content & dismissable \tn % Row Count 4 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\seqsplit{http://materializecss.com/collections.html}} \tn \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}{Shadow}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{z-depth-{[}0-5{]}} \tn % Row Count 1 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\seqsplit{http://materializecss.com/shadow.html}} \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}{pulse}} \tn \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{\seqsplit{http://materializecss.com/pulse.html}% Row Count 1 (+ 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}{Pagination}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{pagination} \tn % Row Count 1 (+ 1) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{5.377cm}}{disabled} \tn % Row Count 2 (+ 1) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{active} \tn % Row Count 3 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}-} \SetRowColor{LightBackground} \mymulticolumn{1}{x{5.377cm}}{\seqsplit{http://materializecss.com/pagination.html}} \tn \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{5.377cm}{x{2.09034 cm} x{2.88666 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Helpers}} \tn % Row 0 \SetRowColor{LightBackground} valign-wrapper & {[}left,right,center{]}-align \tn % Row Count 2 (+ 2) % Row 1 \SetRowColor{white} left & right \tn % Row Count 3 (+ 1) % Row 2 \SetRowColor{LightBackground} hide & hide-on-small-only \tn % Row Count 4 (+ 1) % Row 3 \SetRowColor{white} \seqsplit{hide-on-med-only} & hide-on-med-and-down \tn % Row Count 5 (+ 1) % Row 4 \SetRowColor{LightBackground} \seqsplit{hide-on-med-and-up} & hide-on-large-only \tn % Row Count 7 (+ 2) % Row 5 \SetRowColor{white} truncate & hoverable \tn % Row Count 8 (+ 1) \hhline{>{\arrayrulecolor{DarkBackground}}--} \SetRowColor{LightBackground} \mymulticolumn{2}{x{5.377cm}}{\seqsplit{http://materializecss.com/helpers.html}} \tn \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} % That's all folks \end{multicols*} \end{document}