What is the difference between display: inline-block and float: left

Question

What is the difference between display: inline-block and float: left

Navigation

#1 by (3 votes)
#2 by (2 votes)
#3 by (1 votes)

4

When testing with alignment of div , both have the same purpose

But what would be the difference?

css css3

asked by anonymous 28.05.2015 / 15:41

3 answers

How not to automatically sort IN (MySQL) Regex in dynamic string of X characters, in dynamic content

score 3 · Answer 1

inline-block is the joining of behaviors inline (eg: only occupy content space, do not break line) and block (eg configurable dimensions) into a single HTML element

float causes the element to float in the specified direction above the other HTML elements.

They can be similar because float adds some features that inline-block has, but not all.

score 2 · Answer 2

2

In some situations one can replace the other, but they do not necessarily do the same thing. Take a look at this article link that has an explanation with examples.

28.05.2015 / 16:50

score 1 · Answer 3

Float Property

Display Property

Float: left;

The element floats to the left

Display: inline-block

Displays an element as inline-level block container. The inside of this block is formatted as block-level box, and the element itself is formatted in an inline-level box.

Basically, the left float only throws things to the left, since the inline-block arrow they must acquire line format as long as there is space and when the space ends it, in block form, breaks to the next line.

In the start links you have examples.