Modificacion en tabla

[OsSk4R]

Buenas a todos,
No ando bien en css, de hecho unicamente tengo los conocmientos minimos.

Bueno, al grano. Tengo una tabla normal y corriente que dentro de ella añado unos resultados... El problema es que quiero "modernizar" (por llamarlo de alguna manera) la tabla.
Actualmente esta es mi tabla:
estilo:

Código:

.lol {
border: 1px solid #CCC;
background-color: #F7FBFF;
font-family: Verdana;
font-size: 11px;
color: #666;
}

tabla:

Código lola:

<table width='492'  cellpadding='0' cellspacing='0' border='0'  align='center' class='lol'>
        <tr>
        <td bgcolor='#cfdbe3'><img src='images/iconos/33.png' style='float:left'><b>Titulo:</b> $row_sql[titulo]</td><td bgcolor='#cfdbe3'><a href='#'><font face='verdana' color='#4180C6'><img src='images/iconos/warning.png' border='0' title='Click si hay algún problema con la película'></a></td></tr>
        <tr>
                <td>
<img src='$row_sql[userfile]' style='float:left'></img><p align='right'>Idioma: <img src='images/banderitas/spain.gif'></p>Sinopsis: $row_sql[sinopsis]<br><br>
Fecha salida: $row_sql[fecha_salida] Ver: <a href='$row_sql[enlace]'><img src='images/iconos/play.png' border='0'></a> Subido by: $row_sql[nickmiem]<br><br> Idioma: $row_sql[nombre_idioma] ¿Enlace roto?</td>
<tr>
<td bgcolor='#cfdbe3'>Subida por <b><i>$row_sql[nickmiem]</i></b> </td><td bgcolor='#cfdbe3'><a href='ver_entera/$row_sql[id]/$row_sql[id_g_p]/$row_sql[fecha]'><font face='verdana' color='#4180C6'><img src='images/iconos/siguiente.png' border='0'></a></td></tr>
<br>
</table>
 

Si lo comprueban veran que es una tabla normal y corriente. Yo lo que quieor hacer es algo asi:


Donde las partes en rojo son lo que quiero añadir a mi actual tabla. No se como hacerlo, creo que es facil, pero no tengo ni idea. He probado añadirle unas cuantas etiqueras <td> por si acaso, pero que va, se me queda todo...

Muchas gracias de antemano,

[xurxinho]

<style type="text/css">
table.principal{width:300px;}
table.secundaria{width:100%;border:1px solid #666;}
div.cajarright{
width:100px;
background-color:#ca0000;
}
</style>
<table class="principal" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="right">
<div class="cajarright">&nbsp;</div>
</td>
</tr>
<tr>
<td>
<table class="secundaria" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
lo que sea
</td>
</tr>
<tr>
<td>
lo que sea
</td>
</tr>
<tr>
<td>
lo que sea
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<div class="cajarright">&nbsp;</div>
</td>
</tr>
</table>

[OsSk4R]

Muchas gracias, es lo que buscaba, me ha servido :)

Saludos,

PD: Voy a empezar a leer sobre css, porque asi no puedo seguir -.-