/    /  Pure CSS – Horizontal Tables

Pure CSS – Horizontal Tables:

In this tutorial, we will learn about creating Horizontal lined tables in HTML using Pure CSS. Pure CSS provided the class name called “pure-table-horizontal” for creating the tables having data separated by horizontal lines. We need to add this class along with pure-table class in the <table> element. Below is the example for creating a horizontal table in Pure CSS.




<title>Pure CSS Horizontal Table</title>


<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/pure-min.css" integrity="sha384-nn4HPE8lTHyVtfCBi5yW9d20FjT8BJwUXyWZT9InLYax14RDjBj46LmSztkmNP9w" crossorigin="anonymous">

<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-min.css">



<table class="pure-table pure-table-horizontal">
































Below is the output: