Foros del Web » Creando para Internet » CSS »

Formularios [Alineación, Filebox]

Estas en el tema de Formularios [Alineación, Filebox] en el foro de CSS en Foros del Web. Saludos a todos : LLevo poco días manejando CSS... y me esta agradando , pero ahora me topé con un problema que ya le "he ...
  #1 (permalink)  
Antiguo 01/08/2005, 14:00
Avatar de jam1138
/** @package Moderador */
 
Fecha de Ingreso: julio-2004
Ubicación: sèveR led onieR lE
Mensajes: 9.368
Antigüedad: 13 años, 4 meses
Puntos: 101
Formularios [Alineación, Filebox]

Saludos a todos :

LLevo poco días manejando CSS... y me esta agradando , pero ahora me topé con un problema que ya le "he movido" por todos lados y hayo manera de conseguir lo que quiero .... espero me puedan ayudar.

Se trata de hacer una sección para subir múltiples archivos... cómo esta opción quiero este "a la mano" pensé en ponerla como un recuadro dentro del contenido. El producto final sería algo así:
(Click aquí si no se visualiza la imágen)

(La imágen la árme copiando, cortando y pegando de las mismas pruebas que iba haciendo)


Pueden ver lo que tengo >> aquí <<. He dejado solo lo que --según yo-- esta bien, hago comentarios en el mismo código.

Pués bien...
- En FireFox el formulario "sale" del área que le asigné... en Iexplorer permanece dentro pero me ensancha esa área (o ya no veo bien?).
- No hayo la manera de alinear el Textbox+"Título: " y el Filebox para que abarquen el mismo espacio... no me pregunten que he intentado... ya no tengo ni idea... he hecho de todo...
- En FF el Filebox me lo agranda (la altura) más... ¿tendré que crear un estilo particular para este elemento y para cada navegador?? .
- No me respeta los border del botón "Examinar..." en FF... ¿caso perdido?...

Añadiría la pregunta: Así como se pueden crear estilos para las etiquetas en general (input { .... }), ¿se puede crear estilos directamente para lso diferentes tipos de etiquetas (input type=text {...})????; esto para evitar tener que hacer siempre el <input type="text" class="..."> si todos van a ser iguales....

Cuelquier ayuda, comentario, sugerencia, alternativa será bienvenida (de verdad llevo bastante con esto). Gracias de antemano.
PD: Los botónes de abajo aún no tienen estilo.. no van a quedar así . El botón "+" añadiría un nuevo grupo de Filebox y Textbox... digo! por si se lo preguntaban .
__________________
٩(͡๏̯͡๏)۶
» Cómo hacer preguntas de manera inteligente «

"100 años después, la revolución no es con armas, es intelectual y digital"

Última edición por jam1138; 01/08/2005 a las 23:45 Razón: Agrego link directo a la imágen
  #2 (permalink)  
Antiguo 01/08/2005, 14:48
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
para alinear el texto y la caja de texto, meté las dos cosas en un div con vertical-align : middle. Creo que debería funcionar.

Con respecto a la otra pregunta: no, no se puede. no podés dar estilo según un atributo.

Saludos.
  #3 (permalink)  
Antiguo 01/08/2005, 15:02
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
Con respecto a la respuesta de la otra pregunta (?), ¿no se hace así?:

input[type="text"] {...}

Al menos es lo que entendí de éste enlace: http://www.tierradenomadas.com/tw007.phtml (+- promediando la página)
__________________
...___...
  #4 (permalink)  
Antiguo 01/08/2005, 15:27
AlvaroG
Invitado
 
Mensajes: n/a
Puntos:
tienes razón, me disculpo.
No sabía que eso era posible.
Sin embargo, es probable que los navegadores no tengan buen soporte para esto.

Saludos.
  #5 (permalink)  
Antiguo 02/08/2005, 03:51
Avatar de jam1138
/** @package Moderador */
 
Fecha de Ingreso: julio-2004
Ubicación: sèveR led onieR lE
Mensajes: 9.368
Antigüedad: 13 años, 4 meses
Puntos: 101
Cita:
Iniciado por alvlin
para alinear el texto y la caja de texto, meté las dos cosas en un div con vertical-align : middle. Creo que debería funcionar.
Eso sería para alinearlos verticalmente ¿no?... esa no es la cuestión; mi problema era (es...) hacer coincidir el texto MÁS el Texbox (juntos) CON el Filebox... que tengan el mismo ancho y abarquen todo el espacio posible (con un pequeño margen, claro)...

Bueno... logré hacerlo utilizando el atributo "size" del Filebox, quitándole el padding a <fielset> y centrando su contenido:
Código HTML:
<!-- En la hoja de estilos -->
fieldset {
	margin-bottom:7px;
	text-align:center; 
	padding:0px 0px 4px 0px; <!-- Solo le dejo espacio abajo -->
}

<!-- En el HTML (lo simplifico) -->
<fieldset> <legend>Archivo X</legend>
      <input type="file" name="archivo[]" size="12"> <!-- uso "size" -->
      <label>T&iacute;tulo: </label>
      <input type="text" name="titulo[]">
</fieldset> 
(el link esta actualizado por si quieren verlo)
Pués si bien logré alinearlos... no me gustó esta forma; ¿qué pasará cuándo quiera cambiar de estilo??, ¿tendré que atenerme a el tamaño del Filebox?? ... ojalá haya una manera con CSS puro...

Respecto a el input[type="text"], lo pobré pero no funcionó con IExplorer... leí por ahí así es dicho comportamiento... lo mismo pasa con los input:focus por ejemplo... habrá que asignarle el estilo directamente...

... igual queda el tema de que con FF el Filebox no me toma los bordes y es más alto de lo que debiera... ojalá haya manera...

Gracias por sus comentarios...
(¿por qué ya no carga la imágen que coloqué?)
__________________
٩(͡๏̯͡๏)۶
» Cómo hacer preguntas de manera inteligente «

"100 años después, la revolución no es con armas, es intelectual y digital"
  #6 (permalink)  
Antiguo 02/08/2005, 04:10
Avatar de jam1138
/** @package Moderador */
 
Fecha de Ingreso: julio-2004
Ubicación: sèveR led onieR lE
Mensajes: 9.368
Antigüedad: 13 años, 4 meses
Puntos: 101
... he visto con Iexplorer hay un "movimiento" al ir posicionandose por los texboxes; el margen entre "Archivo 1" y "Archivo 2" se achica!!!! .. otra más: ¿alguién sabe por qué?; los estilos de cuando esta normal y cuando tiene el foco son los mismos salvo el color de fondo y del border (nada que ver con tamaños) y todos tienen el mismo JavaScript... pareciera sucede con el último textbox... igual me cambia el color del borde del botón submit... ... tan bien que iba

__________________
٩(͡๏̯͡๏)۶
» Cómo hacer preguntas de manera inteligente «

"100 años después, la revolución no es con armas, es intelectual y digital"
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:44.