<div>
defaults to block
<span>
defaults to inline
Is there one that defaults to inline-block
?
If not, what special tag name would be appropriate for me to apply 'inline-block' using CSS?
Or should I stick to using a class?
<div>
defaults to block
<span>
defaults to inline
Is there one that defaults to inline-block
?
If not, what special tag name would be appropriate for me to apply 'inline-block' using CSS?
Or should I stick to using a class?
From what I can tell the <img>
tag is the only inline-block
by default. To be on the safe side I would recommend a class, you never know when changing all elements of a certain type will come back to bite you. Or, you could always make up your own tag and assign display:inline-block;
to it. This way you aren't changing the default functionality of standard elements...
EDIT
It also appears that button
, textarea
, input
, and select
elements are also inline-block
Sources:
According to this img
is inline-block
http://dev.w3.org/html5/markup/img.html#img-display
And here claims that button
, textarea
, etc. are as well: http://www.w3.org/TR/CSS2/sample.html
EDIT #2
While the source above claims that img
tags are inline-block
it seems (thanks to Alohci) that they are just inline
http://jsfiddle.net/AQ2yp/
The following were tested in Firefox:
button
is inline-block
: http://jsfiddle.net/GLS4P/
textarea
is inline
: http://jsfiddle.net/235vc/
input
is inline
: http://jsfiddle.net/RFKe8/
select
is inline-block
: http://jsfiddle.net/5B4Gs/