<td class="row3">
Typical default display properties
th {
display: table-cell;
vertical-align: inherit; }
th {
font-weight: bold;
text-align: center; }
.pretty-table td[scope=row3] {
border-left: 2px solid #000000;
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
background-color: #0000FF;
color: #FFFFFF
}
.pretty-table th[scope=row3] {
border-left: 2px solid #000000;
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
background-color: #0000FF;
color: #FFFFFF
}
<tr>
<th scope="row3">Text</th>
<th scope="row3">More Text</th>
</tr>
.row3 {
border-left: 2px solid #000000;
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
background-color: #0000FF;
color: #FFFFFF
}
and leave your TD as it was:<td class="row3"><img src=images/paella.jpg alt='Paella' height=100 width=150></td>
.row4 {
border-left: 2px solid #000000;
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
background-color: #0000FF;
color: #FFFFFF
}
<tr>
<td class="row4"><img src=images/paella.jpg alt='Paella' height=100 width=150></td>
<td class="row4">Paella</td>
</tr>
.title {
background-color: #630C0C;
color: white;
font-size: 65px;
}
.location
{
font-weight: bold;
font-size: 25px;
}
.valigntop {
display: table-cell;
vertical-align: top;
}
.alignleft {
text-align: left;
}
.aligncenter {
text-align: center;
}
.tablecenter {
margin-left:auto;
margin-right:auto;
}
.tdleft {
text-align: left;
}
.pretty-table {
border-collapse: collapse;
margin-left:auto;
margin-right:auto;
}
.pretty-table th, .pretty-table td { padding: 0.5em; }
.pretty-table th[scope=col]
{
border-bottom: 2px solid #333;
border-right: 2px solid #333;
}
.pretty-table th+th[scope=col] { border-right: 1px dotted #666; }
.pretty-table th[scope=row] {
border-right: 2px solid #333;
border-bottom: 2px solid #000000;
border-left: 2px solid #000000;
}
.pretty-table td[scope=row1] {
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
background-color: #0000FF;
}
.pretty-table td[scope=row2] {
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
background-color: #0066FF;
}
.pretty-table td[scope=row3] {
border-left: 2px solid #000000;
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
background-color: #0000FF;
color: #FFFFFF
}
.row4 {
border-left: 2px solid #000000;
border-right: 2px solid #000000;
border-bottom: 2px solid #000000;
background-color: #0000FF;
color: #FFFFFF
}
.pretty-table th, .pretty-table td { color: #632a39; }
.pretty-table th[scope=col] { color: #000; background-color: #8fadcc; }
.pretty-table th+th[scope=col] { color: #fff; background-color: #7d98b3; }
.pretty-table th[scope=row] { background-color: #b8cfe5; }
.content {
background-color: #F6F6FD;
text-align: center;
}
.firstLetter {
background-color: #3399FF;
color: #FFF;
float: left;
font-size: 48px;
margin-right: 10px;
margin-top: 7px;
padding: 18px;
border-radius: 5px;
box-shadow: 0 0 10px -2px #999999;
}
.pretty-table th, .pretty-table td { color: #632a39; }