Sunday, September 18, 2016

html table multiple row col




<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link rel="stylesheet" type="text/css" href="keyword.css">
</head>
<body>
<table class="StandardTable">
  <col>
  <colgroup span="2"></colgroup>
  <colgroup span="2"></colgroup
  <tr>
    <td rowspan="2">KEYWORD</td>
    <td colspan="4" scope="colgroup">Program Areas</td>
    <td rowspan="2">VISIBILITY (ACTIVE / INACTIVE)</td>
  </tr>
  <tr>
    <th scope="col">4-H</th>
    <th scope="col">ANR</th>
    <th scope="col">CD</th>
    <th scope="col">FCS</th>
  </tr>
  <tr>
    <th scope="row">Teddy Bears</th>
    <td>50,000</td>
    <td>30,000</td>
    <td>100,000</td>
    <td>80,000</td>
  </tr>
  <tr>
    <th scope="row">Board Games</th>
    <td>10,000</td>
    <td>5,000</td>
    <td>12,000</td>
    <td>9,000</td>
  </tr>
</table>

</body>
</html>

table, th, td {
  border: 1px solid black;
}

.StandardTable {
  color:#222222 !important;
  border: 1px solid #656565;
  /*-moz-border-radius: 10px;*/
  /*-webkit-border-radius: 10px;*/
  /*margin-left: auto;*/
  /*margin-right: auto;*/
  /*box-shadow: 10px 10px 5px #888888;*/
  width: 90%;
  margin-left: 20px;
  margin-bottom: 15px;
  border-spacing: 0;

}

No comments:

Post a Comment