Skip to content

Instantly share code, notes, and snippets.

@pgherveou
Created December 20, 2011 12:45
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pgherveou/1501457 to your computer and use it in GitHub Desktop.
Save pgherveou/1501457 to your computer and use it in GitHub Desktop.
table display test
/**
* table display test
*/
body {
min-height:100%;
padding-top: 100px
}
div {
outline: 2px solid grey;
padding: 1em;
margin: 1em;
}
.table-div {
background: green;
display: table;
}
.table-row {
background: blue;
display: table-row;
}
.table-cell {
background: red;
display: table-cell;
vertical-align: middle
}
.r1c1 {
font-size: 3em
}
<!-- content to be placed inside <body>…</body> -->
<div class='table-div'>
<div class='table-row'>
<div class='table-cell r1c1'>
(r1-c1) *********** (r1-c1)
</div>
<div class='table-cell r1C2'>
(r1-c2) *************** (r1-c2)
</div>
</div>
<div class='table-row'>
<div class='table-cell r2c1'>
(r2-c1) ***************** (r2-c1)
</div>
<div class='table-cell r2c2'>
(r2-c2) ************ (r2-c2)
</div>
</div>
</div>
{"view":"split","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment