miércoles, noviembre 16, 2016

Cambiar un min-height o min-width así como max-height max-width

En ocasiones tendrás un código definido por CSS donde un div o cualquier otro elemento tiene un tamaño mínimo o máximo de altura o anchura predefinido. Cuando esto pasa en principio no se puede cambiar así que tienes que echar manos de un truquillo (un tip).

Si queréis cambiar el mínimo deberéis poner min-height o min-width a "0" y si queréis cambiar max-height o max-width deberéis poner "none"

Aquí podéis ver el código en acción

See the Pen Solución a problemas con min-width min-height max-width y max-height by Juanje Gregori (@fenderslender) on CodePen.

lunes, junio 20, 2016

HTML5 input type=number no acepta decimales o comas en Chrome

Cuando estás poniendo un input de tipo número y quieres que lo valide un formulario, te das cuenta que utilizando Chrome no te permite poner decimales.

Así que con este código:





La pregunta que te estarás haciendo es si esto es un bug ya que en firefox esto no pasa pero en principio de acuerdo a los estándares de la W3C esto debe ser así.

La solución no puede ser más sencilla, si quieres que los saltos no sean de números enteros y que hayan decimales debes escribir 

step="any"

Y si quieres que no puedan haber números negativos deberás añadir

min="0"

Así que el código final quedaría así:



Espero que os sirva de ayuda.


lunes, abril 18, 2016

Header fijo con bootstrap

Si quieres hacer un header fijo en el top de tu página y estás utilizando bootstrap es muy sencillo conseguirlo.

En la clase del  header debes añadir "navbar-fixed-top" quedando así:


<nav class="navbar navbar-inverse navbar-fixed-top">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">WebSiteName</a>
    </div>
    <ul class="nav navbar-nav">
      <li class="active"><a href="#">Home</a></li>
      <li><a href="#">Page 1</a></li>
      <li><a href="#">Page 2</a></li> 
      <li><a href="#">Page 3</a></li> 
    </ul>
  </div>
</nav>

Ten en cuenta que en el css debes añadir un padding con el tamaño del header,
si no se solapará con tu página

En este caso el alto de mi header es 54px y el CSS quedaría así:



body { padding-top: 54px; }


Podéis encontrar más información aquí:

http://www.w3schools.com/bootstrap/bootstrap_navbar.asp

jueves, abril 07, 2016

Configurar NppFTP para Notepad++

Si el anterior día vimos como instalar NppFTP esta vez vamos a configurarlo. Estos son los pasos que has de seguir para configurarlo.

1 Hacemos click en Profile settings


2 Al ser la primera vez que lo ejecutamos tendremos que añadir un perfil, hacemos click en Add new




3 Escribimos el nombre que queremos que tenga nuestro perfil



4 Aquí podemos ver todas las opciones que tenemos que poner:

    a Aquí ponemos la ip del FTP al que queremos que se conecte
    b Aquí debemos poner el tipo de  conexión (FTP, FTPS o SFTP)
    c Debemos poner el puerto de conexión, por defecto el FTP es el 21 y el SFTP el 22
    d Nombre de usuario
    e Contraseña
    f Por último seleccionamos el directorio remoto por defecto al que queremos que inicie cuando nos conectamos



Espero que os sirva de ayuda.

martes, abril 05, 2016

Instalar NPP-ftp en Notepad ++

El Notepad++ (NP++) es una herramienta muy interesante para todo programador, un editor de texto y de código fuente libre con soporte para varios lenguajes de programación.

Es cierto que existen mejores programas y IDEs que son bastante más potentes pero para empezar a programar y para ciertas tareas rápidas funciona genial.

Hoy vamos a ver como instalar NPP-ftp que es una herramienta que permite al NP++ ver y editar archivos de forma remota. Trabaja con protocolos  FTP, SSH and SFTP. El plugin guarda la información en diferentes perfiles, que pueden ser usados de uno en uno. El plugin permite bajar y subir archivos en tu propio ordenador, así  como crear y borrar directorios y archivos remotamente.

Ahora vamos a ver los pasos para instalar la aplicación en nuestro NP++:

1 Nos dirigimos al menú y hacemos click en Plugins -> Plugin Manager -> Show Plugin Manager

2 En la ventana que nos aparece deberemos buscar el plugin deseado, en este caso NppFTP, marcamos la casilla y hacemos click en Install


3 Nos aparecerá una ventana donde podremos ver el proceso de instalación


4 Nos pedirá que reiniciemos la aplicación. Y le damos a .


5 Ahora ya  tenemos instalado el NppFTP y podemos utilizarlo en nuestro NP++