Am sinnvollsten ist es, wenn man UM eine bestehende Tabelle einfach eine neue, abgerundete umzubaut. Ein Beispiel: Das User-CP in der Memberlist.tpl
| code: |
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
|
<table cellpadding="{$style['tableincellpadding']}" cellspacing="{$style['tableincellspacing']}" border="{$style['tableinborder']}" style="width:{$style['tableinwidth']}" class="tableinborder">
<tr>
<td class="tablea"><table cellpadding="0" cellspacing="0" border="0" style="width:100%">
<tr class="tablea_fc">
<td align="left"><span class="smallfont"><b><a href="index.php{$SID_ARG_1ST}">$master_board_name</a> » {$lang->items['LANG_GLOBAL_MEMBERSLIST']}</b></span></td>
<td align="right"><span class="smallfont"><b>$usercbar</b></span></td>
</tr>
</table></td>
</tr>
</table><br />
|
|
Das ist der ursprüngliche Code
Nun legt man einfach um diese Tabelle eine neue, abgerundete:
| code: |
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
|
<table style="width:{$style['tableinwidth']}" cellspacing="5" class="style3" align="center"><tr><td class="style4">
<table cellpadding="{$style['tableincellpadding']}" cellspacing="{$style['tableincellspacing']}" border="{$style['tableinborder']}" style="width:100%" class="tableinborder">
<tr>
<td class="tablea"><table cellpadding="0" cellspacing="0" border="0" style="width:100%">
<tr class="tablea_fc">
<td align="left"><span class="smallfont"><b><a href="index.php{$SID_ARG_1ST}">$master_board_name</a> » {$lang->items['LANG_GLOBAL_MEMBERSLIST']}</b></span></td>
<td align="right"><span class="smallfont"><b>$usercbar</b></span></td>
</tr>
</table></td>
</tr>
</table>
</td></tr></table>
<br />
|
|
Dabei ist zu beachten, das der ursprünglichen Tabelle nun 100% Breite zugeordnet werden müßen, denn sonst wäre sie ja kleiner als die neue, die umzu ist .... also in der alten Tabellen {$style['tableinwidth']} in 100% ändern.
Nun die Styles dazu noch im ACP definieren, hier also style3 und style4
.style3 {
border: 1px solid #000000;
background-color: #414141;
-moz-border-radius:10px; /* Firefox */
-webkit-border-radius:10px; /* Safari, Chrome */
-khtml-border-radius:10px; /* Konqueror */
border-radius:10px; /* CSS3 */
behavior:url(border-radius.htc);
}
.style4 {
border: 1px solid #333333;
background-color: #000000;
text-align: center;
background-image: url('images/edel_grey/edelgrey02.png');
}
Das ergibt dann die Ansicht im Bildanhang.
Die Äußere Tabelle ist nun Rund, die darin befindliche eckig. Willst Du das ein vollständiger Bogen außen und innen da ist, müßtest Du entweder der Zelle einen Borderradius zuteilen, oder der darunter befindlichen Tabelle.
