################################################## ########
i use css [board-frame] like this
################################################## ###
<!-- FrameTable -->
<table border="0" cellpadding="0" cellspacing="0"
class="board-frame">
<tr>
<td class="topx--"></td>
<td class="top-x-"></td>
<td class="top--x"></td>
</tr>
<tr>
<td class="midx--"></td>
<td class="board-framebg">
<!-- Content -->
<!-- //Content -->
</td>
<td class="mid--x"></td>
</tr>
<tr>
<td class="botx--"></td>
<td class="bot-x-"></td>
<td class="bot--x"></td>
</tr>
</table>
############# css is like this #######################################
/* BoardFrame */
..board-framebg {
background-image: url(Images/Frame/board-back.gif);
background-repeat: repeat;
width: 100%;
}
..board-frame {
width: 95%;
height: auto;
vertical-align: top;
table-layout:fixed;
margin:0 auto
}
..board-frame .topx-- {
background-image: url(Images/Frame/board-topx--.gif);
background-repeat: no-repeat;
vertical-align: top;
}
..board-frame .top-x- {
background-image: url(Images/Frame/board-top-x-.gif);
background-repeat: repeat-x;
}
..board-frame .top--x {
background-image: url(Images/Frame/board-top--x.gif);
background-repeat: no-repeat;
vertical-align: top;
}
################################################## ########
my qustion is when it contain another css frame [boardContent-frame] like
below
it also contain topx--,top-x- and so on
it applied css of board-frame, not boardContent-frame
how should i solve it??
################################################## ###########
<!-- FrameTable -->
<table border="0" cellpadding="0" cellspacing="0"
class="board-frame">
<tr>
<td class="topx--"></td>
<td class="top-x-"></td>
<td class="top--x"></td>
</tr>
<tr>
<td class="midx--"></td>
<td class="board-framebg">
<!-- Content -->
<!-- FrameTable -->
<table border="0" cellpadding="0" cellspacing="0"
class="boardContent-frame">
<tr>
<td class="topx--"></td> ####### this part apply
board-frame.topx--
<td class="top-x-"></td> ###### this part apply
board-frame.top-x-
<td class="top--x"></td> ####### this part apply
board-frame.top--x
</tr>
<tr>
<td class="midx--"></td>
<td class="board-framebg">
<!-- Content -->
<!-- //Content -->
</td>
<td class="mid--x"></td>
</tr>
<tr>
<td class="botx--"></td>
<td class="bot-x-"></td>
<td class="bot--x"></td>
</tr>
</table>
<!-- //Content -->
</td>
<td class="mid--x"></td>
</tr>
<tr>
<td class="botx--"></td>
<td class="bot-x-"></td>
<td class="bot--x"></td>
</tr>
</table>