-1

In HTML/CSS, inline elements, such as <span>, do not support explicitly setting their width via the width CSS property.

This is confusing to many developers, as questions like "Setting the width of inline elements" show.

When learning technologies, I always find it helpful to understand the "why?", the motivation behind design decisions. So:

Why was it decided for inline elements to not support setting width?

  • Are there technical reasons that would make it hard to implement in browsers?
  • Did the designers of CSS think that allowing it would be redundant?
  • Or did someone just think "We'll ignore width for inline elements just to spite people."? (Well, hopefully not.)
  • 3
    It probably has something to do with the fact that HTML is a "document flow" model, where every width more or less affects every other width. It doesn't take much imagination to see that arbitrary settings this deep in the HTML hierarchy would be quite difficult for a browser to manage, especially if they are created dynamically (i.e. through Javascript). In any case, to get a definitive answer to a question like this, you'd have to ask someone on the standards committee. They would probably tell you "creating good standards is hard." – Robert Harvey Jan 30 at 19:17
  • 2
    You have inline-block, don't you? - Ah, by the way, sometimes the motivation is not breaking web sites that are already out there. You are asking the motivation for something that is quite old. – Theraot Jan 30 at 19:45
  • 1
  • 1
    @user253751: (line_width - start_x) + (num_complete_lines * line_width) + (end_x). It just wouldn't be the width of a rectangle anymore but the horizontal space occupied by all text on all lines. I think it would be a rather useless feature, though, and nobody wants to invest time and resources into standardising something for which there is no compelling use case. – Christian Hackl Feb 1 at 20:24
2

I don't have a definitive answer, but I believe that the concept of "width" is too hard to rigorously define within HTML/CSS for inline elements.

Block level elements are defined such that their contents are enclosed in a box and (unless you do funny things like negative dimensions) that box only contains the content of that block-level element and its children. When you specify the width property of such a block level element, you are actually specifying the width of the box that contains the element.

For inline elements, especially if they start halfway on one line and end halfway on another line, it is not possible to define a simple rectangular box that contains only the inline element (and its children), but not parts of adjacent elements and where the start of the element is in the top-left corner of the box and the end in the bottom-right corner (assuming left-to-right script). If you can't define a box, then it easily follows that you also can't change the width of such a non-existent box.

| improve this answer | |
  • Yes, that was my guess too - basically it is not clear what "width" should do for an inline element. – sleske Jan 31 at 12:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.