• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 418
  • Last Modified:

Purpose of an unmarked <span>

I've run into the code below and I'm wondering what the purpose might be of the <span>..</span> tags around the text for the link. If the span has an id or a class then got styled I could see it, but nothing like that is happening here.

Thanks.
span.png
0
steva
Asked:
steva
  • 3
  • 3
  • 2
  • +1
1 Solution
 
geowrianCommented:
It has no visual meaning by itself when used like that. It could be used by a JavaScript function for something, but there are better ways to do that (i.e. an "ID" attribute is preferable). Or maybe a CSS file applies a special style to the SPAN tag, but that's also unlikely.
See:
http://www.w3schools.com/tags/tag_span.asp

"The <span> tag is used to group inline-elements in a document.

The <span> tag provides no visual change by itself.

The <span> tag provides a way to add a hook to a part of a text or a part of a document.

When the text is hooked in a span element you can add styles to the content, or manipulate the content with for example JavaScript."
0
 
Dave BaldwinFixer of ProblemsCommented:
I think some design software 'automatically' puts text in <span> tags so it will have a place to add 'styles' if requested.
0
 
fiboCommented:
Maybe it is styled with

li a span { ... }

or
.books_nav span { ... }

or variations of this
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
stevaAuthor Commented:
Nope.   You guys are all wrong.  The markup is tagging that text to be moved off screen later so that a background image is seen instead: But thanks for the input.  I split the points.


FIR.png
0
 
stevaAuthor Commented:
After looking at the answers again I realized that fibo actually had it right.  So you get the points, fibo.
Thanks.
0
 
geowrianCommented:
Actually, my answer does cover that scenario. But don't bother changing the answer/points.
0
 
fiboCommented:
B-) glad we could help, thx for the grade and points.
CSS can really be nightmare at times.

You should consider using 2 tools to have a better grasp at which "cascades" lead to a given style:
- Xray http://www.westciv.com/xray/ works with IE6+ and FF, really a "no brainer" even though at times it seems less complete than hoped for
- within FF, use the "webdevelopper" add-on which will help you, among other thing, in finding all the cascading styles which affect a given element, and also to "live-edit" the local cached copy of the css, so that you can see the impact at once (...except that there is an issue with background-colors, but this is really a "must-have" tool)
0
 
stevaAuthor Commented:
Fibo,

I use Firebug now, which is how I found the style applied to the <scan> tags. I have Webdeveloper installed but haven't really explored it yet, as I should.  And I hadn't heard of Xray.  It looks like it costs $60, so it must be good.  I'll look into it.  

Thanks.
0
 
fiboCommented:
- had some problems with Firebug: I suggest you deactivate it in normal times, and reactivate it just when debugging
- webdevelopper does not show such problems, so I always keept it active (useful for images and source code, and some css work)
- Xray is free. $60 is their other tool "style master"
0

Featured Post

Learn to develop an Android App

Want to increase your earning potential in 2018? Pad your resume with app building experience. Learn how with this hands-on course.

  • 3
  • 3
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now