HTML element which defaults to display:inline-block?
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...
It also appears that
select elements are also
According to this
And here claims that
textarea, etc. are as well: http://www.w3.org/TR/CSS2/sample.html
While the source above claims that
img tags are
inline-block it seems (thanks to Alohci) that they are just
The following were tested in Firefox:
Is there one that defaults to
Strictly speaking, no there isn't. The W3 HTML specifications do not ever specify default CSS property values for any elements. They do provide a "default style sheet" for HTML 4, but developers are only encouraged to use it - it is not a requirement or any sort of mandate. The HTML 5 specifications indicate "typical default display properties" but, again, those are not required (also keep in mind that HTML 5 is still a working draft anyways).
So that leaves all default values up to the browser and how the developers actually feel elements should be displayed to a user. No one can guarantee that a specific element will display as
inline-block or any other way in someone's browser. You should always explicitly set that if you want it to happen. Don't rely on "defaults."
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?
This is up to you and how you are designing your pages. You should always use elements that are semantically appropriate to the content contained within them. If the element will always be used in a context which will require
inline-block display, by all means set it to that in your style sheet. Otherwise, you will have to resort to classes or more specific selectors in order to make your elements display properly.
Here is a Fiddle that gets the default display value for a majority of HTML tags.
In chrome, the default inline-block elements are:
"INPUT", "BUTTON", "TEXTAREA", "SELECT"