Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What elements can a span tag contain in HTML5?

So I have been a CLI or Cron developer in PHP for most my career and now I am learning why I did not like UI work in school ;) I am dealing with HTML5 validation here and I am not finding an answer to a question that is for curosity. I ran the W3C HTML5 validation on my home page and I got several errors around a div being within a <span> and that is not allowed. I tried changing all <div> within spans to a <p> but recieve pretty much the same error. http://www.w3schools.com/html5/tag_span.asp does not explicitly say what elements are allowed within a <span> and neither does the error from the validator:

Line 85, Column 69: Element p not allowed as child of element span in this context. (Suppressing further errors from this subtree.)

2 questions:

1) What elements if any are allowed within a <span>?

2) Where can I reference for what elements are allowed within another? I have googled but see nothing that has a "W3C" stamp on it.

like image 558
Ghost Avatar asked Jul 03 '12 15:07

Ghost


People also ask

What elements can go inside a span?

The span element is an inline element, which should contain only other inline elements and no block elements. From the spec: Generally, block-level elements may contain inline elements and other block-level elements.

What is an element of a span?

The <span> tag is an inline container used to mark up a part of a text, or a part of a document. The <span> tag is easily styled by CSS or manipulated with JavaScript using the class or id attribute. The <span> tag is much like the <div> element, but <div> is a block-level element and <span> is an inline element.

Is the span tag used in html5?

HTML 5 <span> TagThe HTML <span> tag is used for grouping and applying styles to inline elements. The difference between the <span> tag and the <div> tag is that the <span> tag is used with inline elements whilst the <div> tag is used with block-level content.

What are attributes in span tag?

Definition and Usage The span attribute defines the number of columns a <col> or <colgroup> element should span.


1 Answers

Only inline elements may be contained within inline elements. span is an inline element. So, tags like a, img, sup, etc. can go within a span, but block level elements like div and p cannot.

UPDATE

In reality, different elements which default to inline display behave differently. Some "inline" elements may allow block elements (a for example), while others don't (like span).

If you're interested in what an HTML tag may contain, your most official source is the WHATWG page on HTML elements. You can check any HTML element and see what content is permitted (see 'Content Model' for each element):

http://www.whatwg.org/specs/web-apps/current-work/multipage/#auto-toc-4

Here's the definition of the span tag, which indicates that only 'phrasing' content is allowed.

http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-span-element

like image 108
jackwanders Avatar answered Sep 26 '22 16:09

jackwanders