cjhin · April 21, 2017 22:55
diff --git a/billionaire.csv b/billionaire.csv
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <meta charset="utf-8">

 <style>
 /*
  ##############################
  CSS MAGIC Part 1

  Embed an HTML tables in an iframe/div
  while still being usefully scrollable.
 */

 .wrapper {
  /*
    A static width **must** be set on the wrapper div
    assuming you're trying to insert the table into an iframe/div
    the width is probably already set
  */
  width: 400px;

  /*
    A static height is not necessary, but again, assuming you're inserting into
    an iframe/div, this is probably set
  */
  height: 300px;

  /*
    Allow the table to be horizontally scrollable
    such that the header (thead) and body (tbody) move as one
  */
  overflow-x: scroll;
 }

 /* Make the header and body columns stay aligned */
 thead, tr {
  display: table;
  table-layout: fixed;

  /*
    This is the sad part, there's no way (as far as I can figure out)
    to allow the table to render with dynamic width columns while still
    maintaining all the other scroll features.

    So, you have to manually set this, you could programatically set it in JS
    based on the number of columns too, eg:
      element.style.width = numCols * colWidth;
  */
  width: 850px;
 }

 tbody {
  /* otherwise the body will ignore the height set below */
  display: block;

  /* Allow the body to scroll vertically with a fixed header */
  /* This height is important, regardless of whether a height is set on the parent wrapper div */
  height: 300px;
  overflow-y: scroll;

   /* otherwise the body may try to scroll horizontally and "lose alignment" with the header */
  overflow-x: hidden;
 }


 /*
  ##############################
  CSS MAGIC Part 2

  Make the individual cells horizontally scrollable for long values that don't fit.

  But also hide the scrollbar otherwise the values become unreadable.
 */

 table {
  /* forces all cells to be one line, which is ok if we can scroll the cells horizontally */
  white-space: nowrap;
 }

 td {
  overflow-x: scroll;
  -ms-overflow-style: none;  /* IE 10+ */
  overflow: -moz-scrollbars-none;  /* Firefox */
 }

 td::-webkit-scrollbar {
  display: none;  /* Safari and Chrome */
 }



 /*
  ##############################
  NOT IMPORTANT

  These styles are merely contrast+style for demo purposes
 */

 body {
  background-color: #e0e0e0;
 }

 .wrapper {
  float: left;
  margin-left: 20px;
  background-color: white;
 }

 .text {
  float: left;
  margin-left: 20px;
  width: 350px;
 }

 thead {
  background-color: #4a4a4a;
  color: #fff;
 }

 table {
  border-spacing: 0px;
 }

 th, td {
  padding: 2px 5px;
 }

 td {
  border: 1px solid gray;
 }
 </style>

 <body>
  <div class="text">
    <h2>Embed an HTML table in a statically sized div</h2>
    <h4>(Useful in a dashboard or page with an iframe)</h4>
    <p>1. The table is both horizontally and vertically scrollable</p>
    <p>2. But, the header is fixed when vertically scrolling</p>
    <p>3. The cells are all horizontally scrollable, useful for long values</p>
    <p>4. Entirely in vanilla CSS :)</p>
  </div>
  <div class="wrapper">
    <table id="embedded-table"></table>
  </div>
 </body>

 <script src="//d3js.org/d3.v4.min.js"></script>
 <script>
  /*
    ##############################
    NOT IMPORTANT
    Javascript to load the data into a HTML table
    The important black magic css is in the style above ^
  */
  d3.csv("billionaire.csv", function(error, data) {
    // Header
    var tableHTML = "<thead>";
    tableHTML += "<tr>";
    for(key in data[0]) {
      tableHTML += "<th>" + key + "</th>";
    }
    tableHTML += "</tr>";
    tableHTML += "</thead>";

    // Body (actual data)
    tableHTML += "<tbody>";
    data.forEach(function(d) {
      tableHTML += "<tr>";
      for(key in d) {
        tableHTML += "<td>" + d[key] + "</td>";
      }
      tableHTML += "</tr>";
    });
    tableHTML += "</tbody>";

    document.getElementById("embedded-table").innerHTML = tableHTML;
  });
 </script>
diff --git a/thumbnail.png b/thumbnail.png
name	age	children	marital-status	country	gender	industry	source	net-worth
charlene-de-carvalho-heineken	60	5	Married	Netherlands	Female	Food & Beverage	Inherited	9.8
beny-steinmetz	58	4	Married	Israel	Male	Metals & Mining	Self-made	2.7
lee-shau-kee	86	5	Divorced	Hong Kong	Male	Real Estate	Self-made	22.1
david-thomson	57	4	Divorced	Canada	Male	Media	Inherited	24.3
bidzina-ivanishvili	58	4	Married	Georgia	Male	Diversified	Self-made	5.2
budi-hartono		3	Married	Indonesia	Male	Manufacturing	Inherited	8.6
silvio-berlusconi	78	5	Married	Italy	Male	Media	Self-made	6.8
robert-kuok	91	8	Married	Malaysia	Male	Diversified	Self-made	16.1
andrey-melnichenko	42	0	Married	Russia	Male	Diversified	Self-made	10.1
patrizio-bertelli	68	2	Married	Italy	Male	Retail	Self-made	4.4
pierre-omidyar	47	0	Married	United States	Male	Technology	Self-made	7.8
paul-allen	61	0	Single	United States	Male	Technology	Self-made	17.5
gina-rinehart	60	4	Widowed	Australia	Female	Metals & Mining	Inherited	14.8
pony-ma	43	1	Married	China	Male	Technology	Self-made	15.3
marcel-telles	64	2	Married	Brazil	Male	Finance	Self-made	11.5
susanne-klatten	52	3	Married	Germany	Female	Manufacturing	Inherited	15.3
henry-sy-sr	90	6	Married	Philippines	Male	Diversified	Self-made	12.6
jorn-rausing		0		Sweden	Male	Manufacturing	Inherited	4.4
si-newhouse	87	0	Married	United States	Male	Media	Inherited	8.7
kjeld-kristiansen	66	3	Married	Denmark	Male	Manufacturing	Inherited	6.7
abby-johnson	52	2	Married	United States	Female	Finance	Inherited
antonia-axson-johnson	71	4	Married	Sweden	Female	Manufacturing	Inherited	7.7
liliane-bettencourt	92	1	Widowed	France	Female	Retail	Inherited	31
gerald-grosvenor	62	4	Married	United Kingdom	Male	Real Estate	Inherited	13.4
john-paulson	58	2	Married	United States	Male	Finance	Self-made	12.2
richard-kinder	70	1	Married	United States	Male	Energy	Self-made	11.2
leonardo-del-vecchio	79	6	Married	Italy	Male	Retail	Self-made	17.4
michele-ferrero	89	1	Married	Italy	Male	Food & Beverage	Self-made	23.4
nicky-oppenheimer	69	1	Married	South Africa	Male	Diversified	Inherited	7.3
viktor-vekselberg	57	2	Married	Russia	Male	Diversified	Self-made	14.3
steve-cohen	58	7	Married	United States	Male	Finance	Self-made	10.3
kirsten-rausing	62	0	Single	Sweden	Female	Manufacturing	Inherited	4.1
john-fredriksen	70	2	Widowed	Cyprus	Male	Diversified	Self-made	13.8
hans-rausing	88	3	Married	Sweden	Male	Diversified	Inherited	12
jorge-paulo-lemann	75	6	Married	Brazil	Male	Finance	Self-made	24.4
donald-newhouse		3	Married	United States	Male	Media	Inherited	8
ralph-lauren	75	3	Married	United States	Male	Retail	Self-made	6.9
azim-premji	69	2	Married	India	Male	Technology	Self-made	15.3
august-von-finck		4	Married	Germany	Male	Diversified	Self-made	8.9
chung-mong-koo	76	4	Widowed	South Korea	Male	Manufacturing	Inherited	5.5
yongxing-liu		1	Married	China	Male	Diversified	Self-made	6.6
len-blavatnik	57	0	Married	United States	Male	Diversified	Self-made	18.1
johann-rupert	64	3	Married	South Africa	Male	Diversified	Inherited	7.3
joao-marinho	61	3	Married	Brazil	Male	Media	Inherited	6.2
theo-albrecht-jr	63	1	Married	Germany	Male	Retail	Inherited	16.9
lim-kok-thay	63	3	Married	Malaysia	Male	Service	Inherited	6.5
phil-anschutz	74	3	Married	United States	Male	Telecommunications	Self-made	11.2
sergey-brin	41	2	Married	United States	Male	Technology	Self-made	30.5
john-mars	79	3	Married	United States	Male	Food & Beverage	Inherited	24
vladimir-evtushenkov	66	2	Married	Russia	Male	Diversified	Self-made	2.4
iskander-makhmudov	50	1	Married	Russia	Male	Diversified	Self-made	5.1
gennady-timchenko	61	3	Married	Russia	Male	Diversified	Self-made	12.5
li-ka-shing	86	2	Widowed	Hong Kong	Male	Real Estate	Self-made	30.3
john-menard-jr		6	Divorced	United States	Male	Retail	Self-made	10.1
sunil-mittal	57	3	Married	India	Male	Telecommunications	Self-made	7.3
lee-kun-hee	72	3	Married	South Korea	Male	Technology	Inherited	11.9
ricardo-salinas	59	6	Married	Mexico	Male	Diversified	Self-made	9.8
masayoshi-son	57	2	Married	Japan	Male	Telecommunications	Self-made	13.9
roman-abramovich	48	7	Single	Russia	Male	Diversified	Self-made	13.7
george-kaiser	71	3	Married	United States	Male	Energy	Self-made	13.5
iris-fontbona		3	Widowed	Chile	Female	Metals & Mining	Inherited	13.8
tang-yiu	80	2	Married	Hong Kong	Male	Retail	Self-made	3.3
mohammed-al-amoudi		8	Married	Saudi Arabia	Male	Energy	Self-made	8
wang-jianlin	60	1	Married	China	Male	Real Estate	Self-made	14.4
laurene-jobs	50	3	Widowed	United States	Female	Media	Inherited	16.5
maria-helena-moraes	84	4	Widowed	Brazil	Female	Diversified	Inherited	3
phil-knight	76	2	Married	United States	Male	Retail	Self-made	22.4
dieter-schwarz	75	2	Married	Germany	Male	Retail	Self-made	18.3
sheldon-adelson	81	5	Married	United States	Male	Service	Self-made	28.9
carlos-slim	74	6	Widowed	Mexico	Male	Diversified	Self-made	78.2
teh-hong-piow	84	4	Married	Malaysia	Male	Finance	Self-made	6.8
eka-widjaja	91	15	Married	Indonesia	Male	Diversified	Self-made	7
ivan-glasenberg	57	2	Married	Australia	Male	Metals & Mining	Self-made	5.8
jacqueline-mars	74	3	Divorced	United States	Female	Food & Beverage	Inherited	24
lakshmi-mittal	64	2	Married	India	Male	Metals & Mining	Self-made	14.5
sergey-galitskiy	47	1	Married	Russia	Male	Retail	Self-made	12.5
paolo-rocca	62	0		Italy	Male	Metals & Mining	Inherited	9.8
mikhail-prokhorov	49	0	Single	Russia	Male	Diversified	Self-made	10
jim-goodnight	71	3	Married	United States	Male	Technology	Self-made	12.5
david-koch	74	3	Married	United States	Male	Diversified	Self-made	52.1
micky-arison	65	2	Married	United States	Male	Service	Inherited	7.4
larry-page	41	1	Married	United States	Male	Technology	Self-made	30.7
vladimir-lisin	58	3	Married	Russia	Male	Metals & Mining	Self-made	9.5
cheng-yu-tung	89	4	Married	Hong Kong	Male	Retail	Self-made	13.7
jack-taylor	92	2	Divorced	United States	Male	Service	Self-made	12.7
patrick-soon-shiong		2	Married	United States	Male	Medical	Self-made	8.9
bill-gates	59	3	Married	United States	Male	Technology	Self-made	86.7
harold-hamm	68	5	Married	United States	Male	Energy	Self-made	16.1
hasso-plattner	70	2	Separated	Germany	Male	Technology	Self-made	9.6
jose-marinho	58	5	Married	Brazil	Male	Media	Inherited	6.2
rupert-murdoch	83	6	Married	United States	Male	Media	Self-made	12.9
steve-schwarzman	67	2	Married	United States	Male	Finance	Self-made	10.2
reinhold-wuerth	79	3	Married	Germany	Male	Manufacturing	Self-made	8.7
sulaiman-al-rajhi	94	23	Married	Saudi Arabia	Male	Finance	Self-made	1.9
jim-walton	66	4	Married	United States	Male	Retail	Inherited	38
alwaleed-al-saud	59	2	Married	Saudi Arabia	Male	Diversified	Self-made	28
francois-pinault	78	3	Married	France	Male	Retail	Self-made	14.8
lui-che-woo	84	5	Married	Hong Kong	Male	Service	Self-made	15.3
carlos-da-veiga	66	3	Married	Brazil	Male	Finance	Self-made	10
alejandro-santo-domingo	37	0	Single	Colombia	Male	Food & Beverage	Inherited	14.9
pallonji-mistry	85	4	Married	India	Male	Manufacturing	Inherited	16.3
ron-perelman	71	7	Married	United States	Male	Diversified	Self-made	15.1
dilip-shanghvi		2	Married	India	Male	Medical	Self-made	19.1
german-khan	53	3	Married	Russia	Male	Diversified	Self-made	9.4
ray-hunt		2	Married	United States	Male	Energy	Inherited	8.5
bernard-arnault	65	5	Married	France	Male	Retail	Self-made	29.5
walter-faria	59	1	Married	Brazil	Male	Food & Beverage	Self-made	3.7
oleg-deripaska	46	2	Married	Russia	Male	Metals & Mining	Self-made	7.2
klaus-tschira		2	Married	Germany	Male	Technology	Self-made	6.5
charoen-sirivadhanabhakdi	70	5	Married	Thailand	Male	Food & Beverage	Self-made	12.7
vladimir-potanin	53	3	Married	Russia	Male	Metals & Mining	Self-made	12.5
tadashi-yanai	65	2	Married	Japan	Male	Retail	Self-made	18.8
aliko-dangote	57	3	Married	Nigeria	Male	Diversified	Self-made	19.3
jeff-bezos	50	4	Married	United States	Male	Technology	Self-made	27.7
anil-ambani	55	2	Married	India	Male	Energy	Inherited	5.9
alice-walton	65	0	Divorced	United States	Female	Retail	Inherited	36.2
steve-ballmer	58	3	Married	United States	Male	Technology	Self-made	21.9
anne-cox-chambers	94	3	Married	United States	Female	Media	Inherited	12.4
elaine-marshall		2	Widowed	United States	Female	Diversified	Inherited	17.8
antonio-del-valle	76	5	Married	Mexico	Male	Manufacturing	Self-made	5.2
wee-cho-yaw	85	5	Married	Singapore	Male	Finance	Self-made	5.7
ingvar-kamprad	88	4	Widowed	Sweden	Male	Retail	Self-made	42.5
dietrich-mateschitz	70	1	Single	Austria	Male	Food & Beverage	Self-made	9.8
tsai-wan-tsai	85	4	Married	Taiwan	Male	Finance	Self-made	8.5
raymond-kwok	61	3	Married	Hong Kong	Male	Real Estate	Inherited	14.5
luis-sarmiento	81	5	Married	Colombia	Male	Finance	Self-made	15.9
galen-weston	74	2	Married	Canada	Male	Retail	Inherited	8.8
roberto-marinho	67	4	Married	Brazil	Male	Media	Inherited	6.2
rinat-akhmetov	48	2	Married	Ukraine	Male	Diversified	Self-made	11.4
leonid-mikhelson	59	1	Married	Russia	Male	Energy	Self-made	12.2
johanna-quandt	88	2	Widowed	Germany	Female	Manufacturing	Inherited	11.7
nassef-sawiris	53	4	Married	Egypt	Male	Manufacturing	Self-made	6.8
shiv-nadar	69	1	Married	India	Male	Technology	Self-made	12.8
hansjoerg-wyss		1	Single	Switzerland	Male	Medical	Self-made	14.5
peter-woo	68	3	Married	Hong Kong	Male	Real Estate	Inherited	7.6
alisher-usmanov	61	0	Married	Russia	Male	Diversified	Self-made	15.2
michael-hartono	75	4	Married	Indonesia	Male	Manufacturing	Inherited	8.7
miuccia-prada	66	2	Married	Italy	Female	Retail	Inherited	8.2
joseph-safra	76	4	Married	Brazil	Male	Finance	Self-made	12.2
savitri-jindal	64	9	Widowed	India	Female	Metals & Mining	Inherited	5.4
amancio-ortega	78	3	Married	Spain	Male	Retail	Self-made	57.9
dmitry-rybolovlev	47	2	Separated	Russia	Male	Manufacturing	Self-made	10.3
christy-walton		1	Widowed	United States	Female	Retail	Inherited	39.2
vagit-alekperov	64	1	Married	Russia	Male	Energy	Self-made	9.3
thomas-peterffy	70	3	Divorced	United States	Male	Finance	Self-made	12.4
dhanin-chearavanont	75	5	Married	Thailand	Male	Diversified	Self-made	12.4
thomas-kwok	63	4	Married	Hong Kong	Male	Real Estate	Inherited	14.5
rob-walton	70	3	Married	United States	Male	Retail	Inherited	37
stefan-persson	67	3	Married	Sweden	Male	Retail	Self-made	28.6
finn-rausing	59	0		Sweden	Male	Manufacturing	Inherited	4.1
xavier-niel	47	0	Single	France	Male	Technology	Self-made	7.8
petr-kellner	50	4	Married	Czech Republic	Male	Finance	Self-made	10.7
tsai-eng-meng	57	0	Married	Taiwan	Male	Food & Beverage	Self-made	9.3
michael-otto	71	2	Married	Germany	Male	Retail	Inherited	7.8
larry-ellison	70	2	Divorced	United States	Male	Technology	Self-made	44.3
sara-mota-de-larrea		2	Widowed	Mexico	Female	Metals & Mining	Inherited	11.5
ananda-krishnan	76	3	Married	Malaysia	Male	Diversified	Self-made	8.7
michael-kadoorie	73	3	Married	Hong Kong	Male	Energy	Inherited	9.3
warren-buffett	84	3	Married	United States	Male	Finance	Self-made	70.2
k-p-singh	83	3	Married	India	Male	Real Estate	Inherited	3
george-soros	84	5	Married	United States	Male	Finance	Self-made	26.1
charles-koch	79	2	Married	United States	Male	Diversified	Self-made	52.1
alexey-kuzmichev	52	1	Married	Russia	Male	Diversified	Self-made	7.1
klaus-michael-kuehne	77	0	Married	Germany	Male	Diversified	Inherited	10.6
carlos-ardila	84	4	Married	Colombia	Male	Food & Beverage	Self-made	2.4
leonid-fedun	58	2	Married	Russia	Male	Energy	Self-made	5.4
donald-bren	82	7	Married	United States	Male	Real Estate	Self-made	15.1
leon-black	63	4	Married	United States	Male	Finance	Self-made	5.2
ned-johnson-iii	84	3	Married	United States	Male	Finance	Inherited	7.5
leonard-lauder	81	2	Widowed	United States	Male	Manufacturing	Inherited	9.7
charles-butt	76	0	Single	United States	Male	Retail	Self-made	8.4
stefan-quandt	48	1	Married	Germany	Male	Manufacturing	Inherited	13.7
forrest-mars-jr	83	7	Divorced	United States	Male	Food & Beverage	Inherited	24
eric-schmidt	59	2	Married	United States	Male	Technology	Self-made	8.6
jim-simons	76	3	Married	United States	Male	Finance	Self-made	15.5
mark-zuckerberg	30	0	Married	United States	Male	Technology	Self-made	33.5
ray-dalio	65	4	Married	United States	Male	Finance	Self-made	14.4
michael-dell	49	4	Married	United States	Male	Technology	Self-made	16.3
eli-broad	81	2	Married	United States	Male	Finance	Self-made	7
robin-li	45	4	Married	China	Male	Technology	Self-made	17.1
graeme-hart	59	2	Married	New Zealand	Male		Self-made	7.2
charlie-ergen	61	5	Married	United States	Male	Media	Self-made	17.5
serge-dassault	89	4	Married	France	Male	Manufacturing	Inherited	14
kumar-birla	47	3	Married	India	Male	Diversified	Inherited	7.2
mikhail-fridman	50	2	Married	Russia	Male	Diversified	Self-made	13.7
giorgio-armani	80	0	Single	Italy	Male	Retail	Self-made	8.4
zong-qinghou	69	1	Married	China	Male	Food & Beverage	Self-made	11.5
alexey-mordashov	49	6	Married	Russia	Male	Metals & Mining	Self-made	13.2
alberto-bailleres	83	7	Married	Mexico	Male	Metals & Mining	Self-made	14.5
mukesh-ambani	57	3	Married	India	Male	Energy	Inherited	23.8
mohamed-al-jaber	55	3	Married	Saudi Arabia	Male	Service	Self-made	8.9
ernesto-bertarelli	49	3	Married	Switzerland	Male	Diversified	Inherited	15
carl-icahn	78	2	Married	United States	Male	Finance	Self-made	23.5
rick-cohen		2	Married	United States	Male	Diversified	Inherited	1.3
richard-lefrak	69	2	Married	United States	Male	Real Estate	Inherited	6.6
joao-moreira-salles	52	1	Divorced	Brazil	Male	Finance	Inherited	2.3
heinz-hermann-thiele	73	2	Married	Germany	Male	Manufacturing	Self-made	9
rich-devos	88	4	Married	United States	Male	Retail	Self-made	6.4
milane-duncan-frantz	45	0	Married	United States	Female	Energy	Inherited	6.6
joseph-lau	63	0	Divorced	Hong Kong	Male	Real Estate	Self-made	9.3
dannine-avara	50	0	Married	United States	Female	Energy	Inherited	6.6
liu-yonghao	63	2	Married	China	Male	Manufacturing	Self-made	3.5
walter-salles	58	1	Married	Brazil	Male	Finance	Inherited	2.3
juan-roig	65	4	Married	Spain	Male	Food & Beverage	Self-made	4.1
rupert-johnson	74	0		United States	Male	Finance	Self-made	6.5
idan-ofer	59	5	Married	Israel	Male	Energy	Self-made	4.7
pedro-moreira-salles	55	2	Married	Brazil	Male	Finance	Inherited	2.3
ludwig-merckle	49	2	Married	Germany	Male	Manufacturing	Inherited	4.9
denis-o-brien	56	4	Married	Ireland	Male	Telecommunications	Self-made	5.2
charles-johnson	81	7	Married	United States	Male	Finance	Self-made	6.9
eva-gonda		4	Widowed	Mexico	Female	Food & Beverage	Inherited	6.9
wei-jian-jun	50	0	Married	China	Male	Manufacturing	Self-made	6.1
horst-paulmann	79	3	Married	Chile	Male	Retail	Self-made	4.8
jeff-hildebrand	55	3	Married	United States	Male	Energy	Self-made	5.7
majid-al-futtaim		0	Unknown	United Arab Emirates	Male	Real Estate	Self-made	8.6
john-sall	66	4	Married	United States	Male	Technology	Self-made	3.9
jim-pattison	86	3	Married	Canada	Male	Telecommunications	Self-made	9
dave-duffield	74	0		United States	Male	Technology	Self-made	7.7
abdullah-al-ghurair		0	Married	United Arab Emirates	Male	Diversified	Self-made	8.3
liang-wengen	57	1	Married	China	Male	Manufacturing	Self-made	4.2
phil-green	62	2	Married	United Kingdom	Male	Apparel	Self-made	4.9
suleiman-kerimov	48	3	Married	Russia	Male	Diversified	Self-made	6.2
margarita-louis-dreyfus	52	3	Widowed	Switzerland	Female	Metals & Mining	Inherited	9.6
fernando-moreira-salles	68	2	Married	Brazil	Male	Finance	Inherited	2.3
andrei-skoch	48	8	Divorced	Russia	Male	Diversified	Self-made	7.8
randa-duncan-williams	53	1	Married	United States	Female	Energy	Inherited	6.6
david-tepper	57	3	Married	United States	Male	Finance	Self-made	11.1
charles-gerald-john-cadogan	77	3	Married	United Kingdom	Male	Real Estate	Inherited	6.6
hiroshi-mikitani	49	2	Married	Japan	Male	Technology	Self-made	7.2
yang-huiyan	33	0	Married	China	Female	Real Estate	Inherited	5
stefano-pessina	73	2	Separated	Italy	Male	Medical	Self-made	10.9
elon-r-musk	43	5	Married	United States	Male	Technology	Self-made	11.2
john-malone	73	2	Married	United States	Male	Media	Self-made	7.4
he-xiangjian	72	3	Married	China	Male	Manufacturing	Self-made	7.7
scott-duncan	32	0	Single	United States	Male	Energy	Inherited	6.6
james-packer	47	3	Separated	Australia	Male	Service	Inherited	5.3
gerard-wertheimer	63	2	Married	France	Male	Manufacturing	Inherited	8.8
alain-wertheimer	66	3	Married	France	Male	Manufacturing	Inherited	8.8
zhang-jindong	51	2	Married	China	Male	Retail	Self-made	3.2
dustin-moskovitz	30	0	Married	United States	Male	Technology	Self-made	7.4
lucio-tan	80	6	Married	Philippines	Male		Self-made	5
jean-claude-decaux	76	3	Married	France	Male	Service	Self-made	5.9
takemitsu-takizaki	69	1	Married	Japan	Male	Technology	Self-made	7.1
sandra-ortega-mera	46	3	Married	Spain	Female	Retail	Inherited	5.6
johann-graf	67	3	Divorced	Austria	Male	Service	Self-made	5.6
andy-beal	61	4	Divorced	United States	Male	Finance	Self-made	7.7
zhang-zhidong	42	0	Married	China	Male	Technology	Self-made	5.5
gianluigi-aponte	74	2	Married	Italy	Male	Service	Self-made	7.8
sumner-redstone	91	2	Divorced	United States	Male	Media	Self-made	6
jack-ma	50	1	Married	China	Male	Technology	Self-made	29.7
patrick-drahi	51	4	Married	France	Male	Telecommunications	Self-made	9.6
georg-schaeffler	50	4	Divorced	Germany	Male	Manufacturing	Inherited	16.7
lee-shin-cheng	75	6	Married	Malaysia	Male	Diversified	Self-made	14.7
jan-koum	38	0	Married	United States	Male	Technology	Self-made	6.8
mike-ashley	50	3	Divorced	United Kingdom	Male	Apparel	Self-made	5.3
thomas-schmidheiny	68	4	Married	Switzerland	Male	Manufacturing	Inherited	5.1
eyal-ofer	64	4	Married	Israel	Male	Diversified	Self-made	6.8
natie-kirsh	82	3	Married	South Africa	Male	Food & Beverage	Self-made	8.3
cesar-mata-pires	64	3	Married	Brazil	Male	Manufacturing	Self-made	1
gautam-adani	52	2	Married	India	Male	Diversified	Self-made	6.7
terry-gou	64	4	Married	Taiwan	Male	Manufacturing	Self-made	6.8
thomas-frist	76	0	Unknown	United States	Male	Medical	Self-made	6.9
beate-heister		6	Married	Germany	Female	Retail	Inherited	9.1
les-wexner	77	4	Married	United States	Male	Retail	Self-made	7.3
david-geffen	71	0	Single	United States	Male	Media	Self-made	7
micky-jagtiani	63	3	Married	India	Male		Self-made	5.2
suh-kyung-bae	51	2	Married	South Korea	Male	Manufacturing	Inherited	6.4
	<!DOCTYPE html>
	<meta charset="utf-8">

	<style>
	/*
	##############################
	CSS MAGIC Part 1

	Embed an HTML tables in an iframe/div
	while still being usefully scrollable.
	*/

	.wrapper {
	/*
	A static width must be set on the wrapper div
	assuming you're trying to insert the table into an iframe/div
	the width is probably already set
	*/
	width: 400px;

	/*
	A static height is not necessary, but again, assuming you're inserting into
	an iframe/div, this is probably set
	*/
	height: 300px;

	/*
	Allow the table to be horizontally scrollable
	such that the header (thead) and body (tbody) move as one
	*/
	overflow-x: scroll;
	}

	/* Make the header and body columns stay aligned */
	thead, tr {
	display: table;
	table-layout: fixed;

	/*
	This is the sad part, there's no way (as far as I can figure out)
	to allow the table to render with dynamic width columns while still
	maintaining all the other scroll features.

	So, you have to manually set this, you could programatically set it in JS
	based on the number of columns too, eg:
	element.style.width = numCols * colWidth;
	*/
	width: 850px;
	}

	tbody {
	/* otherwise the body will ignore the height set below */
	display: block;

	/* Allow the body to scroll vertically with a fixed header */
	/* This height is important, regardless of whether a height is set on the parent wrapper div */
	height: 300px;
	overflow-y: scroll;

	/* otherwise the body may try to scroll horizontally and "lose alignment" with the header */
	overflow-x: hidden;
	}


	/*
	##############################
	CSS MAGIC Part 2

	Make the individual cells horizontally scrollable for long values that don't fit.

	But also hide the scrollbar otherwise the values become unreadable.
	*/

	table {
	/* forces all cells to be one line, which is ok if we can scroll the cells horizontally */
	white-space: nowrap;
	}

	td {
	overflow-x: scroll;
	-ms-overflow-style: none; /* IE 10+ */
	overflow: -moz-scrollbars-none; /* Firefox */
	}

	td::-webkit-scrollbar {
	display: none; /* Safari and Chrome */
	}



	/*
	##############################
	NOT IMPORTANT

	These styles are merely contrast+style for demo purposes
	*/

	body {
	background-color: #e0e0e0;
	}

	.wrapper {
	float: left;
	margin-left: 20px;
	background-color: white;
	}

	.text {
	float: left;
	margin-left: 20px;
	width: 350px;
	}

	thead {
	background-color: #4a4a4a;
	color: #fff;
	}

	table {
	border-spacing: 0px;
	}

	th, td {
	padding: 2px 5px;
	}

	td {
	border: 1px solid gray;
	}
	</style>

	<body>
	<div class="text">
	<h2>Embed an HTML table in a statically sized div</h2>
	<h4>(Useful in a dashboard or page with an iframe)</h4>
	<p>1. The table is both horizontally and vertically scrollable</p>
	<p>2. But, the header is fixed when vertically scrolling</p>
	<p>3. The cells are all horizontally scrollable, useful for long values</p>
	<p>4. Entirely in vanilla CSS :)</p>
	</div>
	<div class="wrapper">
	<table id="embedded-table"></table>
	</div>
	</body>

	<script src="//d3js.org/d3.v4.min.js"></script>
	<script>
	/*
	##############################
	NOT IMPORTANT
	Javascript to load the data into a HTML table
	The important black magic css is in the style above ^
	*/
	d3.csv("billionaire.csv", function(error, data) {
	// Header
	var tableHTML = "<thead>";
	tableHTML += "<tr>";
	for(key in data[0]) {
	tableHTML += "<th>" + key + "</th>";
	}
	tableHTML += "</tr>";
	tableHTML += "</thead>";

	// Body (actual data)
	tableHTML += "<tbody>";
	data.forEach(function(d) {
	tableHTML += "<tr>";
	for(key in d) {
	tableHTML += "<td>" + d[key] + "</td>";
	}
	tableHTML += "</tr>";
	});
	tableHTML += "</tbody>";

	document.getElementById("embedded-table").innerHTML = tableHTML;
	});
	</script>