tr height: 30px; : tr « Tags « HTML / CSS






tr height: 30px;

   

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<meta name="Description" content="Information architecture, Web Design, Web Standards." />
<meta name="Keywords" content="your, keywords" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Distribution" content="Global" />
<meta name="Author" content="Erwin Aligam - ealigam@gmail.com" />
<meta name="Robots" content="index,follow" />

<style type='text/css'>
/* start - table */
table {
  border-collapse: collapse;
  margin: 10px;  
}
th strong {
  color: #fff;
}
th {
  background: #e7e6e6 url(MarketPlace-images/button.jpg) repeat-x;
  height: 29px;
  padding-left: 12px;
  padding-right: 12px;  
  text-align: left;
  border-left: 1px solid #f4f4f4;
  border-bottom: solid 2px #fff;
  color: #333;
}
tr {
  height: 30px;
}
td {
  padding-left: 11px;
  padding-right: 11px;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
td.first,th.first {
  border-left: 0px;
}
tr.row-a {
  background: #F8F8F8;
}
tr.row-b {
  background: #EFEFEF;    
}
/* end - table */

</style>



<title>Marketplace</title>

</head>

<body>

<!-- wrap starts here -->
<div id="wrap">
      <h3>Table Styling</h3>              
      <table>
        <tr>
          <th class="first">post date</th>
          <th>title</th>
          <th>description</th>
        </tr>
        <tr class="row-a">
          <td class="first">04.18.2007</td>
          <td><a href="index.html">Augue non nibh</a></td>
          <td><a href="index.html">Lobortis commodo metus vestibulum</a></td>
        </tr>
        <tr class="row-b">
          <td class="first">04.18.2007</td>
          <td><a href="index.html">Fusce ut diam bibendum</a></td>
          <td><a href="index.html">Purus in eget odio in sapien</a></td>
        </tr>
        <tr class="row-a">
          <td class="first">04.18.2007</td>
          <td><a href="index.html">Maecenas et ipsum</a></td>
          <td><a href="index.html">Adipiscing blandit quisque eros</a></td>
        </tr>
        <tr class="row-b">
          <td class="first">04.18.2007</td>
          <td><a href="index.html">Sed vestibulum blandit</a></td>
          <td><a href="index.html">Cras lobortis commodo metus lorem</a></td>
        </tr>
      </table>

</div>

</body>
</html>
  

   
    
    
  








Related examples in the same category

1.'tr' Example
2.table row with class
3.Table style for even rows
4.Set different colors for even and odd table row
5.table row background
6.table row hover
7.stripe table with Javascript
8.Coloring Rows in a Table
9.Selecting cells in row
10.Alternating Row Background
11.Alternating row colors
12.Table with subtotoal row
13.Hiding row
14.tr background: #EFEFEF;
15.tr background: url(img/menubg2.gif) repeat-x bottom left #eaeaea;
16.tr color: #505050;
17.tr padding: 7px;
18.tr text-align: left;
19.Highlighting rows with mouse move