Skip to content

Instantly share code, notes, and snippets.

@josephj
Created February 19, 2013 03:59
Show Gist options
  • Save josephj/4982987 to your computer and use it in GitHub Desktop.
Save josephj/4982987 to your computer and use it in GitHub Desktop.
CSS3 - display:table
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="josephj">
<meta name="created" content="2013-02-19">
<title>CSS3 - display:table</title>
<link rel="stylesheet" href="http://yui.yahooapis.com/3.7.2/build/cssreset/reset-min.css">
<link rel="stylesheet" href="http://yui.yahooapis.com/3.7.2/build/cssfonts/fonts-min.css">
<link rel="stylesheet" href="http://yui.yahooapis.com/3.7.2/build/cssbase/base-min.css">
<style type="text/css">
body {
padding: 10px;
}
.mod {
background: #e8e8e8;
font-family: 微軟正黑體;
font-size: 20px;
margin-bottom: 40px;
padding: 28px 18px;
width: 460px;
}
.table {
display: table;
}
.table .row {
display: table-row;
}
.table .title,
.table .content {
display: table-cell;
padding: 5px;
}
.table .title {
color: #333;
text-align: right;
}
</style>
</head>
<body>
<h1>CSS3 - display: table;</h1>
<div class="mod">
<div class="table">
<div class="row">
<span class="title">Email: </span>
<span class="content">pierre-andre_0733@activation.miiicasa.com</span>
</div>
<div class="row">
<span class="title">Password: </span>
<span class="content">123qwe888</span>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment