Ver Mensaje Individual
  #1 (permalink)  
Antiguo 16/09/2011, 15:57
JUMASOL
 
Fecha de Ingreso: noviembre-2005
Mensajes: 889
Antigüedad: 18 años, 6 meses
Puntos: 8
Maquetación de botón "Adjuntar Archivo"

Hola,

Hace tiempo que realicé una sustitución de botones para envió y borrado en formularios para poner botones según el estilo de la web en el formulario que me conviene.

Así, imaginad este final de formulario con los típicos botones de enviar y borrar:

<div id="aaa">
<input type="submit" name="enviar" value="enviar" />
</div>
<div id="bbb">
<input type="reset" name="reset" value="reset" />
</div>

Yo lo maqueto así y me funciona:

#aaa input, #bbb input {
WIDTH: 49px;
HEIGHT: 11px;
TOP: 0px;
LEFT: 138px;
BORDER: none;
TEXT-INDENT: -9999px;
BACKGROUND: url('Enviar.gif') top;
}
#aaa input:hover {
BACKGROUND: url('Enviar.gif') bottom;
}
#bbb input {
WIDTH: 54px;
LEFT: 201px;
BACKGROUND: url('Borrar.gif') top;
}
#bbb input:hover {
BACKGROUND: url('Borrar.gif') bottom;
}

Sin problemas.

Pero ahora me meto en un formulario que tiene un botón para adjuntar el archivo que vayas a enviar, con este input:


<input <? if (isset ($flag) && $ext=='error' || $tamano > $maximo_tamano) { echo 'class="error"';} else {echo 'class="campo"';} ?> type="file" name="archivo" value="<? echo $_FILE['archivo'];?>" />

Sale una zona donde dice el archivo que has adjuntado, y al lado un botón.

En Chrome me sale "Seleccionar archivo" y en Internet Explorer "Adjuntar".

Supongo que en otros dirá otra cosa.

En fin, no puedo maquetarlo de ninguna manera, porque no sé que elemento es el que debe formar la regla.

Si pongo lo de arriba, se ve afectada toda la zona sobre la que está ese botón.

Me gustaría saber si alguno se ha enfrentado antes a este dilema.

Un saludo y gracias.