Span is an inline element, therefore having span inside span is valid.
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.
Yes, we can use span tag with header tags and there is nothing wrong in it. Indeed this is widely used for styling header tags, specially for coloring a particular word or letter.
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.
3 - It doesn't matter.
BUT, I tend to only use a <span>
inside an <a>
if it's only for a part of the contents of the tag i.e.
<a href="#">some <span class="red">text</span></a>
Rather than:
<a href="#"><span class="red">some text</span></a>
Which should obviously just be:
<a href="#" class="red">some text</a>
It is perfectly valid (at least by HTML 4.01 and XHTML 1.0 standards) to nest either a <span>
inside an <a>
or an <a>
inside a <span>
.
Just to prove it to yourself, you can always check it out an the W3C MarkUp Validation Service
I tried validating:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Title</title>
</head>
<body>
<p>
<a href="http://www.google.com/"><span>Google</span></a>
</p>
</body>
</html>
And also the same as above, but with the <a>
inside the <span>
i.e.
<span><a href="http://www.google.com">Google</a></span>
with both HTML 4.01 and XHTML 1.0 doctypes, and both passed validation successfully!
Only thing to be aware of is to ensure that you close the tags in the correct order. So if you start with a <span>
then an <a>
, make sure you close the <a>
tag first before closing the <span>
and vice-versa.
It doesn't matter - they're both allowed inside each other.
that depends on what you want to markup.
<a>
inside <span>
.<span>
into <a>
SPAN is a GENERIC inline container. It does not matter whether an a
is inside span
or span
is inside a
as both are inline elements. Feel free to do whatever seems logically correct to you.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With