Problema con Texto en tabla

[Damicapu]

Bueeeeenas a todos. Les comento que me he encontrado con un problema en mi web:

En las tablas, los textos que son muy largos, no se acomodan, sino que deforman la web:




Hay una solucion para esto ?

He visto en otras web que cuando pasa esto, el texto en vez de deformar la web desaparece detras de la siguiente columna, o en otros casos, se ponen "....."

Si alguien me puede ayudar se lo agradeceria :D

[orlandopc09]

Hola Damicapu si lo q quieres es ocultar el texto cuando llegue al tope debes asignarle en el css la propiedad overflow:hidden;
Salu2 y espero q haberte ayudado

[Damicapu]

Lo he puesto en el css pero no pasa nada

[orlandopc09]

puedes poner el código para tener una mejor idea

[Damicapu]

Index.php:

Código HTML:

 <h3>Top 10 Personajes</h3>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
		<tbody>
	<?php  include("modules/rankings/top_10_personajes.php"); ?>
		</tbody>
</table> 

top_10_personajes.php

Código HTML:

<?

$query = "SELECT pj,d0 from cuentas order by d0 desc LIMIT 10";
$result = mysql_query($query);
echo '<tr>
		<td><a href="" class="mainlevel">#</a></td>
		<td><a href="" class="mainlevel">Nombre</a></td> 
		<td><a href="" class="mainlevel">Level</a></td>
</tr>';

for($i=0;$i < mysql_num_rows($result);++$i)
{
$row = mysql_fetch_row($result);
$rank = $i+1;

echo "<tr>
		<td><a href='main.php?op=character&character=$row[0]' class='mainlevel'>$rank.</a></td>
		<td><a href='main.php?op=character&character=$row[0]' class='mainlevel'>$row[0]</a></td>
		<td><a href='main.php?op=character&character=$row[0]' class='mainlevel'>$row[1]</a></td>
</tr>";
}
   
           

?> 

[orlandopc09]

hola, si pudieras poner tambien el codigo css seria mucho mejor no obstante prueba poner en las etiqueas a que estan dentro de los td

Código CSS:

white-space: nowrap; 
overflow: hidden;
 

[Damicapu]

En el CSS hay varios mainlevel y no tengo idea cual sera:

Código CSS:

ul#mainlevel-nav
{
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 0.8em;
}
 
ul#mainlevel-nav li
{
    background-image: none;
    padding-left: 0px;
    padding-right: 0px;
    float: left;
    margin: 0;
    font-size: 11px;
    line-height: 21px;
    white-space: nowrap;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #333333;
}
 
ul#mainlevel-nav li a
{
    display: block;
    padding-left: 15px;
    padding-right: 15px;
    text-decoration: none;
    color: #CCCCCC;
    background: transparent;
    font-weight: bold;
}
 
#buttons>ul#mainlevel-nav li a { 
    width: auto;
}
 
ul#mainlevel-nav li a:hover{
    color: #FFFFFF;
    background-color: #383838;
}
 
a.mainlevel:link, a.mainlevel:visited {
    display: block;
    background: url(../images/menu_bg.png) no-repeat;
    vertical-align: middle;
    font-size: 11px;
    color: #a0a0a0;
    text-align: left;
    padding-top: 5px;
    padding-left: 12px;
    height: 20px !important;
    height: 25px;
    text-decoration: none;
    font-weight: bold;
}
 
a.mainlevel:hover {
    background-position: 0px -25px;
    text-decoration: none;
    color: #fff;
    font-weight: bold;
}
 

(Asi esta el CSS original, no esta editado por mi)

Muchas gracias por tu ayuda :D

[masterojitos]

Damicapu, ya te dieron la solucion... debes agregar:

Código CSS:

overflow: hidden;
white-space: nowrap;
 

A tus clases css.... ya sea a ul#mainlevel-nav li o a ul#mainlevel-nav li a
Prueba y te saldra.....

Suerte.

[Damicapu]

Probe poner esos atributos en todos lados pero no funciono, no pasa nada.

Lo he puesto de esta manera:

Código HTML:

 <td id="right_side">
			<div id="left_outer">
			<div id="div">
			<div id="left_inner">
			<div class="moduletable">
			<div style="overflow: hidden;>
	<h3>Top 10 Personajes</h3>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
		<tbody>
	<?php  include("modules/rankings/top_10_personajes.php"); ?>
		</tbody>
</table> 

De esta manera funciona, pero me deforma toda la web, no se por que :S

Algo raro pasa con el CSS. Lo he puesto en todos lados como me dijeron y NADA, el error no se corrije.

[masterojitos]

mi estimado, porque nos diste el css de una lista ul ??? si el problema esta en el td -.-

Intenta agregando esta clase en tu css:

table td{overflow: hidden; white-space: nowrap; }
o tambien quizas en el a
table td a{overflow: hidden; white-space: nowrap; }
o por ultimo, accediendo a la clase
a.mainlevel{overflow: hidden; white-space: nowrap; }

Asi te deberia funcionar...

Suerte

[Damicapu]

Hermano, esto esta volviendome loco. Lo que me has dado no dio resultado :S

Te dejo el CSS completo para que lo mires, tal vez tiene algo mas que no estamos teniendo en cuenta:

http://www.mediafire.com/?a65q1te7texujfb

[masterojitos]

La verdad.... es que con esas dos clases se debe solucionar... pero el problema es que no las colocas donde se debe..... Lo mejor que puedes hacer es subir toda la web.... para poder aca editarla y enviartela de nuevo..... o mejor aun subir tu web a un hosting (Pago o Gratuito) y enviar el enlace para revisarlo online.

Suerte.

[Damicapu]

Te he dejado el link por mensaje privado. Prueba de nuevo, ya funciona. No puedo mandarte mas mensajes privados, dice que has alcanzado el maximo de mensajes :P

[Damicapu]

Ahhhhhhhhhh !

Ya esta solucionado el problema. Pero en FIREFOX se sigue viendo mal. Probe con google chrome y esta fixeado.

[masterojitos]

Ya me hiciste vaciar mis 150 mensajes privados ^^
Asi que soluciona eso para poder acceder....