Posicionamiento de una tabla dentro de una imagen

[Jask]

Muy buenas, que tal?
Os quería hacer una consulta. Tengo que modificar un plugin de wordpress el cual es un calendario con un listado de imágenes que cambian (ajax) y encima de la imagen va una tabla la cual tiene unos inputs type text para rellenarlos y posteriormete editarlos. El problema que tengo es que cuando no está la tabla puesta, está todo pefecto (la imagen de abajo)



Código:

Código PHP:

  <?php 
 
// Include wordpress API functions 
if (!function_exists('add_action')) { 
        $wp_root = $_SERVER['DOCUMENT_ROOT']; 
        if (file_exists($wp_root.'/wp-load.php')) { 
                require_once($wp_root.'/wp-load.php'); 
        } else { 
                require_once($wp_root.'/wp-config.php'); 
        } 
} 
 
### Function: Adding in the head an external js 
add_action('init', calendarBravo_init_method); 
function calendarBravo_init_method(){ 
 $calendarBravoJSfile = WP_PLUGIN_DIR.'/wp-calendarBravo/wp-calendarBravo.js'; 
 if( file_exists($calendarBravoJSfile) ) 
    wp_enqueue_script('wp-calendarBravo.js', WP_PLUGIN_URL.'/wp-calendarBravo/wp-calendarBravo.js'); 
} 
 
### Function: Adding in the head an external css 
add_action('wp_print_styles', 'calendarBravo_stylesheet'); 
function calendarBravo_stylesheet() { 
  $calendarBravoCSSurl = WP_PLUGIN_URL.'/wp-calendarBravo/wp-calendarBravo.css'; 
  $calendarBravoCSSfile = WP_PLUGIN_DIR.'/wp-calendarBravo/wp-calendarBravo.css'; 
  if( file_exists($calendarBravoCSSfile) ) { 
    wp_register_style('wp-calendarBravo.css', $calendarBravoCSSurl); 
    wp_enqueue_style( 'wp-calendarBravo.css'); 
  } 
} 
 
// Set 'manage_calendarBravo' Capabilities To Administrator      
$role = get_role('administrator'); 
if(!$role->has_cap('manage_calendarBravo')) { 
    $role->add_cap('manage_calendarBravo'); 
} 
 
### Function:  Creating  
add_action('admin_menu', 'calendarBravo_menu'); 
 
function calendarBravo_menu() { 
 
 if (function_exists('add_menu_page')) { 
   add_menu_page('Calendar Bravo', 'Calendar Bravo','manage_calendarBravo','wp-calendarBravo/calendarBravo_manager.php'); 
 } 
 
} 
 
### Function: Short Code For inserting Calendar Bravo in a Page 
add_shortcode('page_calendarBravo', 'calendarBravo_shortcode'); 
function calendarBravo_shortcode($atts) { 
        return calendarBravo_archieve($atts); 
} 
 
### Displays Club Bravo content archieve and the form for sending the content. 
function calendarBravo_archieve($atts){ 
 getSelectCalendar(); 
 echo "<div id=\"calendarDiv\" name=\"calendarDiv\" style=\"background:url('".getFirstBackgroundImage()."') no-repeat; height:1000px; width:1000px;\"></div>\n";  
 
} 
 
### Displays a select with the available background images 
function getSelectCalendar(){ 
 $xmlsrc = $_SERVER['DOCUMENT_ROOT']."/wp-content/plugins/wp-calendarBravo/calendarBravo.xml"; 
 $xml = simplexml_load_file($xmlsrc); 
 $cont = 1; 
 foreach ($xml->children() as $calendarImage){ 
  if($cont == 1) 
   $selected = "selected"; 
  else 
   $selected = ""; 
 
  $options = $options. "<option value=\"".$calendarImage->url."\"".$selected.">".basename($calendarImage->url)."</option>\n"; 
 
  $cont += 1;  
 } 
 
    if($options <> "") 
          echo "<select id=\"BackgroundSelect\" name=\"BackgroundSelect\" onchange=\"ChangeCalendarBackground()\">\n".$options."</select>\n"; 
         
    } 
 
 
### Get the first url background image 
function getFirstBackgroundImage(){ 
 $xmlsrc = $_SERVER['DOCUMENT_ROOT']."/wp-content/plugins/wp-calendarBravo/calendarBravo.xml"; 
 $xml = simplexml_load_file($xmlsrc); 
 return $xml->children()->children()->url; 
} 
 
 
?>   

Pero cuando pongo la tabla, con un position absolute, queda bastante descuageringado. Os dejo una imagen para que lo véan:



Código:

Código PHP:

  <?php 
 
// Include wordpress API functions 
if (!function_exists('add_action')) { 
        $wp_root = $_SERVER['DOCUMENT_ROOT']; 
        if (file_exists($wp_root.'/wp-load.php')) { 
                require_once($wp_root.'/wp-load.php'); 
        } else { 
                require_once($wp_root.'/wp-config.php'); 
        } 
} 
 
### Function: Adding in the head an external js 
add_action('init', calendarBravo_init_method); 
function calendarBravo_init_method(){ 
 $calendarBravoJSfile = WP_PLUGIN_DIR.'/wp-calendarBravo/wp-calendarBravo.js'; 
 if( file_exists($calendarBravoJSfile) ) 
    wp_enqueue_script('wp-calendarBravo.js', WP_PLUGIN_URL.'/wp-calendarBravo/wp-calendarBravo.js'); 
} 
 
### Function: Adding in the head an external css 
add_action('wp_print_styles', 'calendarBravo_stylesheet'); 
function calendarBravo_stylesheet() { 
  $calendarBravoCSSurl = WP_PLUGIN_URL.'/wp-calendarBravo/wp-calendarBravo.css'; 
  $calendarBravoCSSfile = WP_PLUGIN_DIR.'/wp-calendarBravo/wp-calendarBravo.css'; 
  if( file_exists($calendarBravoCSSfile) ) { 
    wp_register_style('wp-calendarBravo.css', $calendarBravoCSSurl); 
    wp_enqueue_style( 'wp-calendarBravo.css'); 
  } 
} 
 
// Set 'manage_calendarBravo' Capabilities To Administrator      
$role = get_role('administrator'); 
if(!$role->has_cap('manage_calendarBravo')) { 
    $role->add_cap('manage_calendarBravo'); 
} 
 
### Function:  Creating  
add_action('admin_menu', 'calendarBravo_menu'); 
 
function calendarBravo_menu() { 
 
 if (function_exists('add_menu_page')) { 
   add_menu_page('Calendar Bravo', 'Calendar Bravo','manage_calendarBravo','wp-calendarBravo/calendarBravo_manager.php'); 
 } 
 
} 
 
### Function: Short Code For inserting Calendar Bravo in a Page 
add_shortcode('page_calendarBravo', 'calendarBravo_shortcode'); 
function calendarBravo_shortcode($atts) { 
        return calendarBravo_archieve($atts); 
} 
 
### Displays Club Bravo content archieve and the form for sending the content. 
function calendarBravo_archieve($atts){ 
 getSelectCalendar(); 
 echo "<div id=\"calendarDiv\" name=\"calendarDiv\" style=\"background:url('".getFirstBackgroundImage()."') no-repeat; height:1000px; width:1000px;\"></div>\n";  
 
} 
 
### Displays a select with the available background images 
function getSelectCalendar(){ 
 $xmlsrc = $_SERVER['DOCUMENT_ROOT']."/wp-content/plugins/wp-calendarBravo/calendarBravo.xml"; 
 $xml = simplexml_load_file($xmlsrc); 
 $cont = 1; 
 foreach ($xml->children() as $calendarImage){ 
  if($cont == 1) 
   $selected = "selected"; 
  else 
   $selected = ""; 
 
  $options = $options. "<option value=\"".$calendarImage->url."\"".$selected.">".basename($calendarImage->url)."</option>\n"; 
 
  $cont += 1;  
 } 
 
    if($options <> "") 
          echo "<select id=\"BackgroundSelect\" name=\"BackgroundSelect\" onchange=\"ChangeCalendarBackground()\">\n".$options."</select>\n"; 
        ?> 
         
            <style type="text/css"> 
     
        .tablaGeneral{ 
            position:relative; 
            top:278px; 
            left:109px; 
        } 
         
        .tablaGeneral td{ 
            height:25px; 
            /*width:103px; 
            border:2px solid green;*/ 
        } 
         
        .tablaGeneral input{ 
            background-color:none; 
            border:1px dashed #aaaaaa; 
            width:95px; 
            height:20px; 
        } 
         
        .tablaGeneral .espaciado{ 
            width:23px; 
        } 
 
    </style> 
<table border='0px' class='tablaGeneral' > 
      <tr> 
        <td><input type='text' name='A1'value="A1"></td> 
        <td class="espaciado"></td> 
        <td ><input type='text' name='B1'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='C1'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='D1'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='E1'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='F1'></td> 
    </tr> 
      <tr> 
        <td><input type='text' name='A2' value="A2"></td> 
        <td class="espaciado"></td> 
        <td ><input type='text' name='B2'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='C2'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='D2'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='E2'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='F2'></td> 
    </tr> 
    <tr> 
        <td><input type='text' name='A3' value="A3"></td> 
        <td class="espaciado"></td> 
        <td ><input type='text' name='B3'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='C3'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='D3'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='E3'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='F3'></td> 
    </tr> 
    <tr> 
        <td><input type='text' name='A4' value="A4"></td> 
        <td class="espaciado"></td> 
        <td ><input type='text' name='B4'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='C4'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='D4'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='E4'></td> 
        <td class="espaciado"></td> 
        <td><input type='text' name='F3'></td> 
    </tr> 
</table> 
         
        <?php 
    } 
 
 
### Get the first url background image 
function getFirstBackgroundImage(){ 
 $xmlsrc = $_SERVER['DOCUMENT_ROOT']."/wp-content/plugins/wp-calendarBravo/calendarBravo.xml"; 
 $xml = simplexml_load_file($xmlsrc); 
 return $xml->children()->children()->url; 
} 
 
 
?>   

Como pueden ver en la segunda imagen, entre el select y la imagen en si queda un espacio en blanco, y cada vez que voy añandiendo más filas se va haciendo más grande. Alguna idea de lo que puede estar pasando ?

Muchas gracias !!!