Problema con hr

k_rol9 · #1 (**permalink**) 10/11/2010, 09:38

Hola,

tengo una pagina web con un hr:

<hr width=100% style = 'height: 1px;color:darkblue'/>

que separa el titulo de una tabla dinámica q muestro debajo.

El problema sq esa tabla a veces tiene muchos datos y se desborda de la pantalla por lo que aparece el scrollbar.

Lo que me gustaría saber es como hacer para que el hr ocupe toda la pantalla cuando hay overflow, puesto que según lo tengo puesto ahora, solo ocupa el 100% de la pantalla predeterminada por el navegador.

Muchas gracias¡¡¡, un saludo

rbczgz · #2 (**permalink**) 10/11/2010, 11:08

Hola k_rol9,

Si pudieras postear esa parte del código, seguro que sería más fácil ayudarte.

k_rol9 · #3 (**permalink**) 11/11/2010, 09:33

Pos el código es basicamente el titulo, la linea hr y una tabla q genero desde asp;

<body LANGUAGE=javascript onload="return window_onload()">
<form name=campo method="post">
<input type=hidden id="orden" name="orden">
</form>
<H3 style = "margin-left:1.5%"><%Response.Write(titu); %></H3>
<hr class = 'linea' style = 'height: 1px;color:darkblue'/>
<%
function dibuja_tabla(sql, conexion, campo) {
var rs = Server.createObject('ADODB.Recordset');;
rs.Open(sql, conexion);
var i = 0;
while (!rs.EOF) {
if ((i == 0) || (i % 2 == 0)) {
var bgcolor = "#ececec";
}
else {
var bgcolor = "#F8F8F2";
}

Response.Write("</tr><tr style=\"background-color:" + bgcolor + ";\" onmouseover='this.style.backgroundColor=\"yellow\" ' onmouseout='this.style.backgroundColor= \"" + bgcolor + "\"'>");
if (eve != "") {
//vamos recorriendos las columnas de cada rs
for (var x = 0; x < l; x++) {
//comparacion para centrar campos que no sean de buscar
if ((array_titulos[x] == 'Fecha') || (array_titulos[x] == 'Area') || (array_titulos[x] == 'Turno')) {
if (rs.Fields(x).Value == null) {
Response.Write("<TD align = center class = 'texto' >");
} else {
Response.Write("<TD align = center class = 'texto' >" + (array_titulos[x] == 'Fecha' ? slibfecha_DateToEsp(new Date(rs.Fields(x).Value)) : rs.Fields(x).Value));
}
} else {
if (rs.Fields(x).Value == null) {
Response.Write("<TD class = 'texto'>");
} else {
var comprueba = false;
//si no son esos campos entramos por buscar elemento, asi q comparo los titulos
//que vamos a mostrar con los grupos en los q busco la palabra
for (var m = 0; m < l_grupos; m++) {
var palabra = grupos_buscar[m].split("-");
var num_palabras = palabra.length; //saber cuantas palabras subrayamos para ese campo
var campo_eve = palabra[0];
//si el dato q voy a sacar coincide con los campos en los q buscamos datos, pasamos a buscarlo y subrayar
if (rs.Fields(x).name == campo_eve) {
var datos = rs.Fields(x).value;
//tenemos que hacer el replace para cada una de las palabras q se busque en ese campo, empezamos en 1 pq 0 es el campo
for (var s = 1; s < num_palabras; s++) {
//Para que haga el replace para todo el texto pq sino solo sustituye el 1º
var cadena = new RegExp(palabra[s], "gi");
datos = datos.replace(cadena, "<span class = 'remarcar'>" + palabra[s] + "</span>");
//comprobar si la palabra tiene vocales exóticas para reemplazarlas o no
var exoticas = new RegExp(/(À|Á|Â|Ã|Ä|È|É|Ê|Ë|Ì|Í|Î|Ï|Ò|Ó|Ô|Ö|Ù|Ú|Û|Ü)/gi);
var exoticas = palabra[s].search(exoticas);
if(exoticas != -1){
//ahora buscamos también para subrayar la palabra sin acentos
var palabra2 = sinacentos(palabra[s]);
var cadena = new RegExp(palabra2, "gi");
datos = datos.replace(cadena, "<span class = 'remarcar'>" + palabra2 + "</span>");
}
}
Response.Write("<td class = 'texto' >" + datos);
comprueba = true;
}
}
if (comprueba == false) {
//sino coincide sq no hay condición en él
Response.Write("<TD class = 'texto' >" + (rs.Fields(x).Value));
}
}
}
}
} else {
for (var x = 0; x < l; x++) {
//comparacion para centrar campos menos eventos
if ((array_titulos[x] == 'Fecha') || (array_titulos[x] == 'Area') || (array_titulos[x] == 'Turno')) {
if (rs.Fields(x).Value == null) {
Response.Write("<TD class = 'texto' align = center >");
} else {
Response.Write("<TD class = 'texto' align = center >" + (array_titulos[x] == 'Fecha' ? slibfecha_DateToEsp(new Date(rs.Fields(x).Value)) : rs.Fields(x).Value));
}
} else {
if (rs.Fields(x).Value == null) {
Response.Write("<TD class = 'texto' align = center >");
} else {
Response.Write("<TD class = 'texto'>" + (rs.Fields(x).Value));
}
}
}
}
Response.Write("</tr>");
i += 1;
rs.MoveNext();
}
rs.Close;
Response.Write("</table>");
}

%>
</body>

El problema es q la tabla a veces tiene muchos campos y por ello es necesario que aparezca el scrollbar, pero claro la hr queda del mismo tamaño q estaba y visualmente queda bastante feo.

¿Alguna sugerencia?

Saludos

rbczgz · #4 (**permalink**) 11/11/2010, 11:04

Hasta donde yo veo, creo que se resuelve así:

<hr class = 'linea' style = 'height: 1px;color:darkblue; width: 100%;'/>

Te faltaba el atributo width, ya sea en el tag hr o en style, yo te lo he puesto en style.

Espero que te sirva.

k_rol9 · #5 (**permalink**) 12/11/2010, 02:26

Hola,

pues el width lo tenia puesto en class = linea

/* linea q cruza */
.linea
{
width:100%;
margin-left: 10px;
color: #18b5ef;
height: 3px;
}

probé a ponerlo fuera como dijiste pero que va, no funciona.

Es una pijada pero no entiendo pq no lo hace.

Alguna otra idea??

Gracias, saludos

rbczgz · #6 (**permalink**) 12/11/2010, 05:01

Por probar... ¿pudiera ser que tengas alguna otra cosa (tabla, capa,...) que te limite el ancho de la línea.

Es lo único que se me ocurre... Lo siento