Foros de daboweb
MULTIMEDIA, Video digital, Grabación, Diseño gráfico, Diseño web, Programación => Webmasters - Diseño Web - Programación - Diseño gráfico => Mensaje iniciado por: Flugtelero en 22 de Febrero de 2007, 07:52:45 pm
-
He intentado varias veces poner un formulario dentro de una tabla y no hay manera; tanto si lo hago con NVU como con el Bloc de Notas el campo de texto aparece siempre fuera de la tabla, encima de ella. ¿Alguna sugerencia la respecto? |o|
-
¿Puedes pegar el código que estás usando para verlo?
-
Creo que debo de estar cometiendo algún error de bulto, Liamgls, pues me he guiado por la simple lógica de poner primero el código inicial de la tabla, luego el formulario (con un script para el focus que tampoco me ha funcionado) y después el cierre de la tabla.
Ahí va el código en cuestión:
<table align="center" width="700" border="void" cellpadding="5">
<tr>
<td colspan="2" align="center">Formulario</td>
</tr>
<td width="50%">Texto uno</td>
<td width="50%">Texto dos</td>
</tr>
<tr>
<td colspan="2" align="center">
<form>
<input type="text" name="nombre" size="40">
</form>
<script>
document.form.nombre.focus();
</script>
</tr>
</table>
En fin, al menos me queda el consuelo de que si la burrada es muy evidente :ciego: también tendrá fácil enmienda...
-
Yo en Firefox lo veo así:
http://img359.imageshack.us/img359/2646/tablafv3.jpg
-
Hola.
Yo lo he abierto con Opera, Firefox, IE6 e IE7 y veo siempre el campo de texto dentro de la tabla.
Quitando el script, también.
-
No lo he probado pero arriba hay una etiqueta TR cerrada pero no abierta...
<tr>
<td colspan="2" align="center">Formulario</td>
</tr>
<td width="50%">Texto uno</td>
<td width="50%">Texto dos</td>
</tr>
Saludos!
Mabel
-
O la peliaguda es la del medio??:
<tr>
<td colspan="2" align="center">Formulario</td>
</tr>
<td width="50%">Texto uno</td>
<td width="50%">Texto dos</td>
</tr>
-
La verdad es que no entiendo el misterio... Si ha vosotros os aparece el campo del formulario dentro de la tabla, a mí también debería ocurrirme lo mismo. Voy a corregir esas marcas que comenta Mabel y probaré de nuevo.
Gracias y ya os comentaré el resultado (a todo esto, ¿no se supone que con el script de focus el cursor debe aparecer parpadeando? A mí no me sale ni a la de tres).
-
O la peliaguda es la del medio??:
<tr>
<td colspan="2" align="center">Formulario</td>
</tr>
<tr>
<td width="50%">Texto uno</td>
<td width="50%">Texto dos</td>
</tr>
:-d
-
La verdad es que no entiendo el misterio... Si ha vosotros os aparece el campo del formulario dentro de la tabla, a mí también debería ocurrirme lo mismo. Voy a corregir esas marcas que comenta Mabel y probaré de nuevo.
Gracias y ya os comentaré el resultado (a todo esto, ¿no se supone que con el script de focus el cursor debe aparecer parpadeando? A mí no me sale ni a la de tres).
Bueno, a mi tampoco me sale parpadeando ... ¿será cosa de la caché del navegador? Prueba a borrarla y los temporales de internet ... a ver si por ahí ;-)
-
Esto parece un Expediente X :panic:, he probado a corregir esas etiquetas dudosas borrar los archivos temporales y nada, no hay cambios. En IE se ve el campo de texto justo encima de la mitad izquierda de la tabla y en el Firefox aparece también fuera de la tabla y mucho más desplazado hacia la izquierda. Para mayor recochineo en ninguno de los dos casos hay rastro de cursor, ni fijo ni parpadeante, en el campo de texto. La verdad, el asunto me resulta incomprensible...
-
Respecto al tema del cursor, aparece cuando pinchas dentro de la "caja", entonces sí aparece parpadeando.
Por cierto, yo veo el formulario dentro de la tabla, exactamente igual que en la captura de LiamNgls...
He probado con tres navegadores distintos: Firefox, Safari y Explorer...(sí que pasa, explorer para mac)
Tal cual pones el código aquí, se ve, otra cosa sería ver todo el html de tu documento, evidentemente nosotros estamos probando sólo esa parte del código...
Saludos!
Mabel
-
Gracias por tu aportación, Mabel, aunque para mí la cosa es bastante rara. Para tomarme un respiro en el cabreo y no en mis ejercicios, probé a sustituir la tabla por una capa. Primera sorpresa: excepto el cursor renuente, todo lo demás aparece en su sitio. Segunda sorpresa: tan alentador resultado se limita desgraciadamente al IE, pues con el Firefox la capa literalmente desaparece; el campo de texto del formulario y sus botones figuran en la posición correcta, pero un primer texto se ve fuera de su lugar correcto (encima del contorno de la volatilizada capa, como sucedía con el campo del formulario en el caso de la tabla); un segundo texto sí está donde debe. Vamos, un enigma de lo más fastidioso. |o|
-
Confesaré algo... hace tiempo que dejé de trabajar con capas. Las detesto!!!
Revisa el código completo de principio a fin, cada etiqueta, no sólo las relativas al form y a la tabla. No sé hasta qué punto es un código limpio limpio, ya sabes lo que quiero decir.
Un saludo!
Mabel.
-
Yo también veo bien la tabla (en IE, Opera y Firefox). Así que hay por lo menos un 75% de probabilidad de que sea cosa del resto de tu código, o de tus navegadores. Revisa bien todas las etiquetas.
Para los estilos mirate esto:
http://www.disenorama.com/tutoriales/comentarios-condicionales-para-ie (http://www.disenorama.com/tutoriales/comentarios-condicionales-para-ie)
-
De acuerdo, Gepetto, revisaré el código. Al señalar que puede ser cosa de mis navegadores, ¿a qué te refieres exactamente? Dicho de otro modo:¿que se supone que debería revisar y/o enmendar? (¿Y de qué modo? :???:) No obstante, y ya que estoy probando también con una capa, ¿existe alguna diferencia práctica entre poner el formulario en una tabla o en una capa? Lo digo por el rechazo que muestra Mabel hacia ellas, y supongo que es una opinión a considerar viniendo de alguien con experiencia.
-
Ufffff pero espera, espera que debí explayarme más al hacer esa afirmación. Ahora mismo te explico más...
Detesto trabajar con capas pero trabajo con ellas (aunque diga que dejé de trabajar con ellas, ambigüedad power, no me queda más remedio, ahora bien... si por mi fuera). También detesto trabajar con tablas. Y ya no te cuento con tablas y capas jajajaja. Trabajo con ambas. Realmente pienso que hay que buscar el equilibrio y usar unas y otras con cierta cabeza. Confesaré que a veces, sobretodo para mis propias webs, me molesto menos y me dejo llevar por la fuerza de lo rápido.
Tanto las tablas como las capas tienen algún tipo de incompatibilidad con distintos navegadores. Pero... se usan. Están presentes en mi día a día pero hay días en los que me apetece tirar el ordenata por la ventana.
Es curioso porque he leído los mismos comentarios tanto de una opción como de otra, así que al final hago lo que me da la gana y que creo que es mejor en cada caso.
Disculpa si mi comentario te ha despistado.
Realmente el problema no está en las herramientas de desarrollo web (incluyendo el html a pelo y en editor de texto), sino en los malditos navegadores.
Por ello últimamente adoro cosas como wordpress y sus templates por defecto. Vienen tan estándar y tan compatibles con todo que evitas dolores de cabeza. Pero... cuando te toca hacer las cosas y buscar tú la compatibilidad, usabilidad y demás "idades"...
Saludos, hoy estoy algo espesa, espero haberme explicado con cierta claridad. Y por cierto, experiencia tienen todos los que te han respondido. Confieso cierta debilidad por Gepetto :-d
Mabel
-
Hola.
Me voy a intrometer yo también (que experiencia tengo muy poca y sabiduría, menos).
En una ocasión recuerdo haberme peleado con unas imagenes que yo colocaba dentro de una tabla: pues... una de ellas se me visualizaba medio dentro y medio fuera de la tabla.
Lo que yo estaba intentando hacer era utilizar varias capas dentro de una sola columna para ahorrar código. Al final puse cada capa en su celda y se solucionó. Pero seguro que había "algo" que me empujaba fuera de la tabla a esa imagen (algún padding o margin o un float mal utilizado)
En realidad no sabemos, como dice Mabel, si hay algo alrededor de ese código que pueda producirte el problema. ¿Estás utilizando una oja de estilo? ¿Hay otra capas o tablas alrededor del formulario que puedan estar haciendo "flotar" sus elementos como si fueran fantasmitas?
Si, realmente, copias ese fragmento, y sólo ese, lo pegas en el block de notas, lo guardas como html y, al abrirlo, no se te visualiza correctamente, es muy probable que haya algo que no va en tu navegador, como apunta Gepetto (aunque sería mucha casualidad que fueran dos: tanto el IE como el Firefox).
Por eso te diría que te instalaras Opera, para ir descartando, o que reinstalaras el Firefox. Eso para intentar aclarar si es cosa del navegador.
Las páginas es mejor diseñarlas para el Firefox y luego ver como apañar las cosas para que se vean bien también con IE. Un truquito ya te lo ha comentado Gepetto: una oja de estilo específica para el IE que corrige sus errores (y que son suyos, del IE, y no tuyos). Así que no te preocupes en ecceso si no se ve bien con el IE qué, aunque en este caso concreto no hayamos encontrado la explicación del porqué, en realidad suele ser la norma.
Otra cosa que se me ocurre es que, quizás, estés utilizando una resolución de pantalla distinta a la que hemos utilizado nosotros. Yo, por ejemplo, no dispongo de la posibilidad de poner una resolución de 1152x864 , de 1280x820 o de 1280x1024 qué, con las pantallas panorámicas, también pasan cositas raras y, si no, que te lo cuente Mabel. Así que, mejor, dinos la resolución que utilizas. (ya sabes: botón derecho en el escritorio>propiedades>pestaña "configuración").
Saludos.
-
Tranquila, Mabel, tu comentario sobre las capas no me ha despistado, sólo me había llamado un poco la atención, y por si acaso quería asegurarme de que no estaba ensayando una estrategia quizá no muy aconsejable. Lo del wordpress me resulta desconocido, así que googlearé unos minutos para enterarme de qué va la cosa. Como bien dices, las incompatibilidades entre navegadores crean bastantes dolores de cabeza.
Piero, el código que estoy usando es muy simple. Ciertamente lo he ido variando durante mis intentos de lograr un resultado aceptable, objetivo que por ahora sólo he conseguido con IE y no en Firefox. Ahora mismo no lo tengo a mano (a ojo, quiero decir), pero esencialmente es eso, poner un formulario en una tabla -a la que de momento sustituye una capa- y sin más añadidos que un título de cabecera y dos textos breves entre aquél y el formulario en sí. De todas maneras revisaré el código minuciosamente y probaré de nuevo, y desde luego tomaré nota de la resolución de pantalla. Ya os comentaré el resultado de estas nuevas pruebas.
Gracias por vuestra ayuda ;-)
-
Si, realmente, copias ese fragmento, y sólo ese, lo pegas en el block de notas, lo guardas como html y, al abrirlo, no se te visualiza correctamente, es muy probable que haya algo que no va en tu navegador
Estoy muy de acuerdo con esto. Pruébalo para salir de dudas.
De todas formas un par de cosas más: No se que resolución estás utilizando, pero a menos de 800x600 la tabla puede verse mal. También puede ser cosa de alguna barra de herramientas "adicional" que haya podido modificar la configuración del navegador.
-
P.S.:Mabel, eres un encanto. Supongo que cuando me pongo en plan "cansino" debilito a más de un@ ;-)
-
Bueno, he probado varias veces y finalmente he conseguido que la tabla se vea en Firefox y en IE. Detecté un fallo, consistente en que el código escrito a mano había sido tergiversado por NVU, y las etiquetas del formulario precedían a las de la tabla :fadao: Reescribí manualmente el código en el Bloc de Notas y es apto:
<html>
<head>
<title>Tabla</title>
</head>
<body>
<table align="center" border="0" width="700" bgcolor="FFFF00">
<tr>
<td colspan="2" align="center">Tabla</td>
</tr>
<td width="50%">Texto uno</td>
<td with="50%">Texto dos</td>
</tr>
<td colspan="2" align="center">
<form>
<input type="text" size="40">
</form>
<script>
document.form.nombre.focus();
</script>
</tr>
</table>
</body>
</html>
Hasta ahí, todo bien, de hecho incluso el efecto focus se aprecia claramente con un parpadeo nítido del cursor una vez que se pincha dentro del campo de texto, tal y como aseguraba Mabel. Sin embargo, para animar un poquillo el conjunto se me ocurrió convertir la cabecera tanto de la tabla como de la capa en una marquesina, y entonces las cosas empezaron a cambiar.
Resumo aquí las diferencias:
-con la tabla, la marquesina funciona en Firefox pero no en IE;
-con la capa sucede al revés, queda perfecta en IE pero da problemas
en Firefox.
-Si se adjudica un fondo a la marquesina -por ejemplo "gray"-, el color gris
se adapta limpiamente en la capa. Por el contrario, en la tabla se aprecia
un pequeño contorno amarillo tanto por sus extremos como por encima.
-Y si además se quiere cambiar el tamaño y color del texto de la marquesina
-lo hice con "red"- puede pasar en la tabla cualquier cosa (ninguna buena)
con los dosnavegadores; sólo en el caso de la capa funciona bien IE.
-Por último, una pega adicional de la tabla (aunque esto será posiblemente
una torpeza mía) es que si intento separar elementos internos con <br>
toda la tabla baja en pantalla, mientras que dentro de la capa sirve muy
bien.
Ah, sí, mi resolución de pantalla es de 1280x800, con lo que supongo se descarta algún problema derivado de esa variable.
Gracias y un saludo ;-)
-
Me alegra que hayas solucionado el problema inicial. Siempre acaba siendo necesario revisar todo el código y no sólo la parte que consideramos que da problemas ;-)
-con la tabla, la marquesina funciona en Firefox pero no en IE;
-con la capa sucede al revés, queda perfecta en IE pero da problemas
en Firefox.
Si te digo que odio las marquesinas ¿qué pasa? XDDDDDDDDDD volvemos a lo de siempre, compatibilidades con navegadores y limpieza de código. Tablas/capas capas/tablas. Mola que estés probando cosas.
-Si se adjudica un fondo a la marquesina -por ejemplo "gray"-, el color gris
se adapta limpiamente en la capa. Por el contrario, en la tabla se aprecia
un pequeño contorno amarillo tanto por sus extremos como por encima.
En este caso entonces trabajarás con capas ;-)
-Y si además se quiere cambiar el tamaño y color del texto de la marquesina
-lo hice con "red"- puede pasar en la tabla cualquier cosa (ninguna buena)
con los dosnavegadores; sólo en el caso de la capa funciona bien IE.
:-D
-Por último, una pega adicional de la tabla (aunque esto será posiblemente
una torpeza mía) es que si intento separar elementos internos con <br>
toda la tabla baja en pantalla, mientras que dentro de la capa sirve muy
bien.
Entiendo que has revisado el código y que el <br> o <br /> está dentro de la celda correspondiente.
Oye, está claro que lo tuyo son las capas.
Por cierto, prueba a otras resoluciones la web, siempre viene bien para no llevarse sorpresas con la maquetación.
Saludos!
Mabel
-
Ojalá tuviera el asunto tan claro como tú, Mabel, a mí esas divergencias entre navegadores me están desquiciando los nervios. El añadido de la marquesina se me ocurrió para mitigar un poco el estatismo del conjunto; no sé si las odias por sus incompatibilidades navegatoriles o por simple cuestión estética, a mí es la primera razón mencionada la que me empieza a irritarme. Si una de las dos opciones en liza -tabla o capa- funcionase por igual en IE y Firefox sería la solución perfecta. Seguiré probando a ver qué pasa, aunque si no consigo solucionar el problema sería todo un dilema escoger entre IE y Firefox. Sé que mucha gente no se lo pensaría al respecto en uno u otro sentido, pero lo más deseable es lograr un código apto para ambos.
Gracias por las sugerencias y si surge alguna novedad (ojalá positiva) ya lo comentaré. ;-)
-
Navegadores ... lo generadores de pesadillas de los webmasters ... aunque siempre se puede hacer alguna chapucilla http://www.ricplan.net/index.php/css-compatible-para-internet-explorer-y-firefox
Lo del borde amarillo que comentas ...
<table align="center" border="0" width="700" bgcolor="FFFF00">
Ese bgcolor es una tonalidad amarilla ... cámbialo por el color de fondo o directamente elimina ese parámetro ;-)
-
Gracias por la info, Liamgls. El tema del color amarillo es el siguiente: había probado en una tabla/capa de un color determinado una marquesina con otro color de fondo. En la capa el ajuste es perfecto, pero en la tabla no. Si no he entendido mal, tu consejo es que prescinda directamente de colorear la tabla y así me evito ese desajuste de contornos. Puede que finalmente no me quede más remedio... si es que consigo que la dichosa marquesina funcione en los dos navegadores, claro... :ciego:
Un saludo ;-)
-
¿Tienes relleno de celda o algo similar? no tienes por qué prescindir de colorear la tabla, sino que puedes buscar otra opción... de "configuración" de la misma....
-
Lo que hice fue adjudicar un color de fondo a la marquesina de cabecera y establecer para toda la tabla el valor border="0". Pensaba que con eso sería suficiente, pero resulta que no. También me parece que he ensayado (digo "me parece", porque después de varios cambios y rabieta continua uno acaba por no estar seguro del todo de qué ha probado y qué no) el colorear esa celda concreta. De momento es lo que se me ha ocurrido para reconfigurar la cosa. Está visto que deberé seguir insistiendo... :dabo:
-
Si es un borde y tienes border="0" es probable que haya un relleno y/o espaciado de celda. Es lo único que se me ocurre sin haber tomado en todo el día las pastillas para el Alzheimer...
<table border="0" cellspacing="0" cellpadding="0">
Por probar no pierdes nada...
Cellspacing para el espaciado de celda y Cellpadding para el relleno.
Saludos!
Mabel
-
De acuerdo, Mabel, probaré la opción triple cero. Sé que uno de los valores que mencionas lo puse en cero al igual que el borde, aunque no creo haberlo hecho con el otro, veré qué tal va así...
(¿Pastillas para el Alzheimer? Pásame la receta, que tanto código frustrante me está perjudicando más el psiquismo que el visionado de la filmografía completa de Joselito :fumando:)
-
Bueno, más que código frustrante quizá sería más exacto decir "navegadores frustrantes"...
-
el visionado de la filmografía completa de Joselito
Créeme, es mejor pegarse con los navegadores y el código que con semejante aberración filmográfica. :ciego:
A ver si el triple 0 (moola) sirve de algo...
Saludinos!
Mabel
-
¡Genial, Mabel, el triple cero ha funcionado! :-). La marquesina se adapta limpiamente a la celda, y además funciona por igual en IE y Firefox. No obstante, el problema que tengo ahora es la posición del texto. El de la marquesina tiene más margen inferior que superior, y en las dos celdas contiguas situadas inmediatamente más abajo, el texto de la celda derecha aparece un poco más bajo que el de la izquierda. Con IE se aprecia una separación mínima entre ambas celdas, el Firefox pega un texto con otro (el nulo espaciado interceldístico, supongo). Ese desajuste de los textos es el siguiente objetivo a corregir... También he probado con las capas el script del enlace que me brindó Liamgls para homogeneizar el resultado visual en ambos navegadores, pero no me funcionó; quizá lo puse donde no debía (¿entre <head> y </head>? :???:).
Muchas gracias :cool:
-
LEE MI SIGUIENTE MENSAJE Y OLVÍDATE DE ESTE QUE LEES:
Hay que alinear el texto en la tabla tanto vertical como horizontalmente...
Uséase... además de alinear el texto en la tabla, ya sea left, center o rigt, tienes que especificar una distancia del texto dentro de cada celda, que puede ser en pixeles o a lo cómodo que es lo que hacemos en la mayoría de los casos, alineando también con left, center y right, para ello te propongo que pruebes vspace y hspace. Si lo quieres para toda la tabla igual lo pones en el table, si en cada celda quieres una cosa... te vas por celdillas, filas o columnas (depende de lo que busques) currándotelo.
Ya me cuentas,
Saludos!
Mabel ;-) oyeeee me alegra el triple 0 power!
-
ESPERA!!!!!! perdona, olvídate eso que se me fué la pinza... jijijijiji
No lo edito por si ya lo ha leído alguien no confundir a la peña.
Prueba con valign... demonios!!!!
Lo mismo valign=right center o left...
Hay días en los que mejor no decir nada...
Mabel
-
Tranquila, Mabel, tomo nota de tu segundo mensaje, esto es, probar con valign=left, center o right. Ya os contaré lo que salga (a ver si hay tanta suerte como con el triple cero power :-)).
Gracias y saludos ;-)
-
La V de valign significa vertical, no te aceptará right, left o similares, eso es para align (horizontal).
Saludos.
-
Lo ves? jajajaja estoy dormida. Top, Bottom etc...
Creo que hasta que acabe mi tratamiento contra la gripe me retiraré cautelosamente ;-)
-
Bueno, Mabel, ya se sabe, la gripe y los fármacos tienen efectos paradójicos :haha: Ya caí en la cuenta de la "V" postiza de align. Lo curioso es que en un ensayo anterior -un simple embrión de tabla sin triple cero y con align="center", el texto de ambas celdas queda perfectamente igualado en la misma línea, con ambos bloques separados por unos píxeles prudenciales. En cambio, en el enredo que nos ocupa, la línea de texto de la celda derecha queda más baja que la izquierda, además de estar rozando ambos bloques de texto, sobre todo en Firefox.
¿Tendrá algo que ver la marquesina? ¿Otro error indetectado? Misterio... |o|
Un saludo y dale una patada a esos virus griposos, Mabel :cool:
-
Lo de la marquesina... ahora que estoy colocada te diré la verdad: LO LLEVO MUY MAL!!!
Pero tú quieres saber cómo arreglar ese entuerto, así que la movida era que no te rulaba la marquesina en la tabla pero sí en la capa??????
Un abrazo
Mabel (fighting con los viruses)
-
Bueno, la marquesina funciona bien tanto en la tabla como en la capa, aunque en esta última el texto queda mejor que en la tabla; vamos, que en la capa el texto presente márgenes superior e inferior equivalentes, mientras que en la tabla el margen inferior es mayor.
Ahora bien (mal, mejor dicho), el lío que tengo en este momento es que en las celdas de más abajo (dos celdas contiguas, se entiende) sus respectivos textos no están a la misma altura de línea, esto es:
CELDA 1 CELDA 2
El texto aparece así
Pero aquí se desmadra.
La diferencia de espacio no es tan grande como aquí, pero el texto de la derecha está un poco más bajo que el izquierdo, y además en Firefox ambos bloques de texto se ven prácticamente pegados lateralmente.
Saludos :cool:
-
Volvemos a lo mismo, alineación del texto dentro de la tabla o de la celda.
De todas formas siempre viene bien ver el código ;-)
Saludinos!
Mabel
-
Ya he solucionado el poblema de los textos disparejos. He visto que si ambos tienen el mismo número de líneas su nivelación es también idéntica. Para disipar el antiestético efecto de su contigüidad tuve que suprimir el triple cero añadiendo algunos pixelillos en cellpadding y cellspacing. La marquesina la situé fuera de la tabla -justo sobre ella-, y asunto zanjado. Ahora sólo me resta retocar un poco el código para que el texto quede un pelín más moñoño, o sea, con sangrado, por ejemplo. Eso sí, tendré que andarme con ojo, porque ya he comprobado que para según qué cosas el IE es más tosco que un rosario de melones :mrgreen:
Un saludo y gracias por la ayuda recibida ;-)
-
XDDDDD más tosco que un rosario de melones... me la apunto!!!
Me alegra que todo haya ido bien y me flipa tu constancia y tesón.
Un saludo!
Mabel :-)
-
Gracias por comentarlo Frugtelero, damos el tema por solucionado.
Un saludo