Desbordamiento de div y redimensionado de la tabla
Publicado por jokings80 (2 intervenciones) el 20/08/2012 09:46:20
Hola,
Tengo un div donde se va mostrando texto que introduce el usuario de forma dinámica y puede que en algún momento se introduzca una palabra muy larga como una URL. Para que el texto se corte y no se desborde el div uso "word-wrap". Funciona perfectamente, sin embargo, en Internet Explorar, aunque corta la palabra y el contenido del div se muestra bien, redimensiona el tamaño de la celda como si no se usara "word-wrap". En los demás navegadores que he probrado no ocurre. Sólo en Internet Explorar.
En el siguiente código se ve un ejemplo del problema,
Tengo un div donde se va mostrando texto que introduce el usuario de forma dinámica y puede que en algún momento se introduzca una palabra muy larga como una URL. Para que el texto se corte y no se desborde el div uso "word-wrap". Funciona perfectamente, sin embargo, en Internet Explorar, aunque corta la palabra y el contenido del div se muestra bien, redimensiona el tamaño de la celda como si no se usara "word-wrap". En los demás navegadores que he probrado no ocurre. Sólo en Internet Explorar.
En el siguiente código se ve un ejemplo del problema,
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Property: Word Wrap</title>
<style type="text/css">
<!--
body {
margin: 0 auto;
width: 800px;
}
.textoDiv {
font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #373737;
font-weight: normal;
text-decoration: none;
text-align: justify;
width: 200px;
word-wrap: break-word;
border: 1px coral solid;
}
--></style>
</head>
<body>
<TABLE TABLE width="200" align="center" valign="top" cellpadding="0" cellspacing="0" border="1">
<TR>
<TD width="200">
<div class="textoDiv">
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
</div>
</TD>
</TR>
</TABLE>
</body>
</html>
¿Se os ocurre qué puede estar pasando o cómo solucionarlo?Gracias por la ayuda!!
Valora esta pregunta
0
