Amigo hay varias diferencias, particularmente uso más
float left por que se adapta a la forma en que desarrollo webs.
¿Cómo desarrollo?
Suelo desarrollar en base a filas y columnas (a veces uso foundation o bootstrap), si piensas usar
float:left tendrás que usar siempre un contenedor con
clearfix para que la web no se deforme, a este
clearfix yo le llamo .Row, mientras que a las columnas .Column (las columnas son float left).
¿Por qué no uso inline-block?
Porque suelo trabajar con medida de fuente en EM (me ayuda al responsive), y el inline-block siempre deja un espacio entre div y div, y aunque hay soluciones (
https://escss.blogspot.com/2012/03/display-inline-block-y-sus-empeno-en.html), me resulta incómodo para utilizar en el layout de una web.
¿Cuándo uso inline-block?
Hay muchas veces que uso inline-block, y por lo general es para incluir íconos dentro de un botón de texto, ahí sirve mucho el vertical-align, que sirve para alinearlos verticalmente.
¿Tienes algún ejemplo de desarrollo con float?
Claro que sí:
HTML:
<div class="Row">
<div class="Column25">
<!-- Esta es una columna de 25% de ancho, podría usarse como un sidebar -->
</div>
<div class="Column75">
<!-- Esta es una columna de 75% de ancho, podría usarse como un el contenido principal -->
</div>
</div>
Y el CSS sería
Insertar CODE, HTML o PHP:
.Row:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
.Column25 {
width: 25%;
float: left;
}
.Column75 {
width: 75%;
float: left;
}
En realidad es un simple ejemplo y va desde mi punto de vista y la manera en que trabajo. No olvides considerar que yo suelo trabajar con preprocesadores (Pug y Stylus), lo que ayuda bastante al desarrollo frontend.
