Simple Data Table

This is an example of a simple data table with sortable columns, resizable columns, and with headers that freeze at the top of the screen as they scroll by.

ID	Username	First Name	Last Name	Birthdate	Pet	Car	Comments
1	wmailes0	Worthington	Mailes	7/2/1987	White-throated monitor	Volvo	posuere cubilia curae nulla dapibus dolor vel est
2	kstrond1	Kizzee	Strond	10/22/1979	White-necked stork	Mercury	cum sociis natoque penatibus et magnis dis parturient
3	lalthrop2	Lisette	Althrop	10/26/1992	Golden brush-tailed possum	Dodge	vel augue vestibulum rutrum rutrum neque aenean auctor
4	polyff3	Page	Olyff	3/23/2016	Duck, blue	Jeep	interdum venenatis turpis enim blandit mi in porttitor
5	kfarmery4	Kakalina	Farmery	9/19/1994	Indian mynah	GMC	posuere cubilia curae nulla
6	mprigg5	Milzie	Prigg	4/29/1998	Crane, black-crowned	Ford	maecenas ut massa quis
7	aamberson6	Annadiane	Amberson	4/29/1985	Marmot, yellow-bellied	GMC	nulla pede ullamcorper augue a suscipit nulla elit
8	rgawkroge7	Ryun	Gawkroge	3/2/1993	Bear, sloth	Ford	pellentesque at nulla suspendisse potenti
9	llippingwell8	Linet	Lippingwell	5/15/2007	Hottentot teal	Toyota	metus vitae ipsum aliquam non mauris morbi
10	aorpin9	Annie	Orpin	12/3/1981	Porcupine, north american	Land Rover	massa tempor convallis nulla neque libero convallis eget eleifend luctus
11	alewtona	Angelle	Lewton	4/10/2015	Yellow baboon	Ford	sed lacus morbi sem mauris laoreet ut rhoncus aliquet pulvinar sed nisl
12	rattrydeb	Ricky	Attryde	3/30/2009	Boa, cook's tree	Dodge	ac nulla sed vel enim sit amet
13	avarrowc	Agnella	Varrow	12/10/1980	Burmese brown mountain tortoise	Mercedes-Benz	eu sapien cursus vestibulum proin eu mi nulla ac enim
14	fwhiteard	Franklyn	Whitear	3/20/2001	Little cormorant	Chevrolet	ridiculus mus vivamus vestibulum sagittis sapien cum sociis natoque penatibus
15	aroydone	Angelia	Roydon	4/10/1988	African red-eyed bulbul	Pontiac	ullamcorper augue a suscipit
16	slemonnierf	Steward	Le Monnier	9/14/2017	Pied kingfisher	Honda	enim lorem ipsum dolor sit amet consectetuer adipiscing elit proin interdum mauris
17	cmanvelleg	Cyrille	Manvelle	8/8/1987	Nuthatch, red-breasted	Buick	cubilia curae duis faucibus accumsan odio curabitur convallis duis consequat
18	bquinaneh	Bernadina	Quinane	6/14/1999	Carpet snake	Jaguar	dolor sit amet consectetuer adipiscing elit proin interdum mauris non ligula pellentesque
19	kattridei	Kendell	Attride	6/1/1991	White-winged dove	Ford	ut massa volutpat convallis morbi odio odio elementum
20	vdemaidj	Veronike	Demaid	12/8/2017	Jungle kangaroo	Volkswagen	ipsum integer a nibh in quis justo maecenas
21	ekyberdk	Evvie	Kyberd	7/13/2013	Tern, white-winged	Mitsubishi	volutpat quam pede lobortis ligula sit amet eleifend pede libero quis orci
22	emacartneyl	Ebenezer	Macartney	11/2/1984	Pied avocet	Audi	ut rhoncus aliquet pulvinar sed nisl
23	nbrunelleschim	Noble	Brunelleschi	1/6/2018	Currasow (unidentified)	Suzuki	semper porta volutpat quam pede lobortis ligula sit amet eleifend pede libero
24	mlooselyn	Malvin	Loosely	8/6/2008	Common melba finch	Volkswagen	eget eros elementum pellentesque quisque porta volutpat erat quisque erat eros
25	sarcaseo	Shara	Arcase	5/31/2003	Crab-eating raccoon	Nissan	suscipit ligula in lacus curabitur at
26	fperkinsp	Fabiano	Perkins	5/23/1988	Trotter, lily	Bentley	in est risus auctor
27	wgoodhewq	Willey	Goodhew	5/15/1989	Woylie	Land Rover	penatibus et magnis dis parturient montes nascetur ridiculus
28	tmathevetr	Trude	Mathevet	6/20/2016	Sage hen	Ford	velit id pretium iaculis diam erat fermentum justo
29	mweinmanns	Minnaminnie	Weinmann	5/22/2016	Striped dolphin	Ford	habitasse platea dictumst etiam faucibus cursus urna ut tellus
30	fstauntont	Flore	Staunton	6/11/1998	Burchell's gonolek	Chevrolet	pellentesque quisque porta volutpat erat quisque erat
31	cdovingtonu	Conchita	Dovington	4/3/2011	Short-beaked echidna	Dodge	viverra dapibus nulla suscipit ligula in lacus curabitur at ipsum
32	tbendsonv	Tish	Bendson	6/30/1992	Galapagos mockingbird	GMC	augue luctus tincidunt nulla
33	fbentingw	Francklin	Benting	5/9/2005	Mexican wolf	Buick	lectus vestibulum quam sapien varius ut blandit non
34	obendingx	Orbadiah	Bending	3/29/1998	Lapwing, southern	Subaru	mi nulla ac enim in tempor turpis
35	eforsydey	Ethan	Forsyde	5/4/2012	Quoll, eastern	Mazda	ipsum primis in faucibus orci luctus et ultrices posuere
36	cbeevorz	Cornelia	Beevor	4/1/1981	Giant otter	Audi	aenean fermentum donec ut mauris eget massa tempor convallis nulla neque
37	sbudgeon10	Skye	Budgeon	11/29/2013	Seal, common	Subaru	vel ipsum praesent blandit lacinia erat vestibulum sed
38	kseaward11	Kalina	Seaward	4/9/1999	Blue and gold macaw	GMC	platea dictumst etiam faucibus cursus urna ut tellus nulla ut erat
39	iechalie12	Ivy	Echalie	9/14/1984	Cobra (unidentified)	Ford	a ipsum integer a nibh in quis justo maecenas rhoncus aliquam lacus
40	jjobey13	Jared	Jobey	4/17/2008	Four-horned antelope	Mazda	porttitor lacus at turpis donec posuere metus vitae ipsum aliquam non mauris
41	mreitenbach14	Matthew	Reitenbach	5/16/2001	Macaw, scarlet	Pontiac	nunc vestibulum ante ipsum primis in faucibus orci luctus
42	vfilov15	Vilma	Filov	6/7/1999	Capuchin, weeper	Chevrolet	sit amet justo morbi ut odio cras mi pede malesuada
43	lklauer16	Lynn	Klauer	12/31/2004	Masked booby	Ford	elit ac nulla sed vel enim sit amet nunc viverra

Whimsical data from mockaroo.com.

Options

Many tables can be on the same page.

Tables need to be identified by one of the class names table-sortable, table-fixed-header, and/or table-resizable depending upon the features you want.

Table headers scroll off screen at the bottom of the tables.