Tabla Fija Con Scroll Html

[overxfl0w13]

El problema visual es éste:

[img width="300" height="300"]http://www.subirimagenes.net/pictures/3c9a969b556a628b3ea9875a1a76e9ca.png[/img]

Tengo que situar una tabla centrada con un tamaño fijo y con scroll para que el texto no la redimensione.

He probado diversas maneras, pero a lo único que he llegado es a dejar fija la tabla y el texto a sobresalir por sus extremos.

¿ Alguna Idea ?

Gracias

[#!drvy]

Deja la tabla con un ancho fijo y centra la, luego para que no te sobresalga el texto puedes poner en el css de esta, la propiedad word-wrap:break-word; o puedes utilizar overflow:auto; para que agregue scroll cuando sea necesario.


Saludos

[overxfl0w13]

Deja la tabla con un ancho fijo y centra la, luego para que no te sobresalga el texto puedes poner en el css de esta, la propiedad word-wrap:break-word; o puedes utilizar overflow:auto; para que agregue scroll cuando sea necesario.


Saludos

Muchas gracias drvy

Es raro, pero no hace nada :S. Lo más seguro es que tenga algún fallo en la declaración de la tabla, la llevo así:

Código (html4strict) [Seleccionar] Expandir

<table width="600" name="codigo" style="background-color: #D8D8D8; table-layout: fixed; overflow: auto; word-wrap: break-word;">
<tr>
<td>
<?php
require_once("geshi/geshi.php");
$ruta = "codigos/".$_POST["codingo"];
$codigo = file_get_contents($ruta);
$ges = new GeSHi($codigo, "c++");
echo $ges->parse_code();
?>
</tr>
</td>
</table>

[#!drvy]

Yep, no me fije que el overflow no se lleva bien ni con table ni con tr ni con td... xD
Así que improvisando... puedes añadir un div antes de la tabla y hacer algo así:

Código (html4strict,1,16,2) [Seleccionar] Expandir

<div style="width:600px; background-color: #D8D8D8;  overflow:auto; word-wrap:break-word;">
<table name="codigo" style="table-layout:fixed; width:100%;">
<tr>
<td>
<?php
require_once("geshi/geshi.php");
$ruta = "codigos/".$_POST["codingo"];
$codigo = file_get_contents($ruta);
$ges = new GeSHi($codigo, "c++");
echo $ges->parse_code();
?>
</td>
</tr>
</table>
</div>

Recuerda que si combinas overflow con word-wrap.. prácticamente overflow queda solo de decoración, porque word-wrap rompe las palabras cuando lleguen al máximo de ancho y a no ser que definas un máximo de alto no se activa =).

Saludos

[WHK]

y si utilizas un margin: 0 auto; y un zoom adecuado al ancho total del html calculado con javascript y $(document).width() ?

Mira que entretenido está esto xD

Código (javascript) [Seleccionar] Expandir

$('body').css('-moz-transform', 'scale(' + ((($(window).width() * 100) / $(document).width()) / 100) + ')');
$('body').css('-moz-transform-origin', 'left top');

Aunque se que no es lo que vas a utilizar, pero para centrarlo basta con poner margin 0 auto, además veo que la tabla está muy hacia el costado, quiere decir que la tienes encerrada en una división que tiene un padding o margin left, sacala de ahi y dejala sola en body y ponle el margin 0 auto, luego le das un ancho fijo, algo asi como unos 950px y su quieres un overflow entonces encierralo en una division con las mismas propiedades con un position relative y overflow auto, el relative es para que internet explorer no haga burradas.

[overxfl0w13]

Muy buenos los dos, únicamente lo he hecho como me ha dicho drvy porque no me llevo yo muy bien con javascript ( de momento ) .

WHK la tabla estaba hacia el costado, porque el texto la redimensionaba, lla verdad es que ni me he fijado si le he puesto algún margin left, pero creo que no xD.

Gracias a los 2, de verdad .

Por cierto, para fijar el alto que podría hacer? Tenía pensado ponerle un scroll lateral también y así fijar completamente la tabla en el centro con una anchura y altura determinada

EDIT: Conseguido, solo tenía que definir el height en el div, gracias a los 2

Podéis pasaros por mi web cuando queráis y postear todo el código que os apetezca
Un saludo