Improve company productivity with a Business Account.Sign Up

x
?
Solved

Purpose of an unmarked <span>

Posted on 2011-02-18
9
Medium Priority
?
420 Views
Last Modified: 2012-05-11
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
Comment
Question by:steva
  • 3
  • 3
  • 2
  • +1
9 Comments
 
LVL 12

Expert Comment

by:geowrian
ID: 34931476
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
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 34931853
I think some design software 'automatically' puts text in <span> tags so it will have a place to add 'styles' if requested.
0
 
LVL 29

Accepted Solution

by:
Bernard S. earned 2000 total points
ID: 34932639
Maybe it is styled with

li a span { ... }

or
.books_nav span { ... }

or variations of this
0
Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

 

Author Comment

by:steva
ID: 34933702
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
 

Author Comment

by:steva
ID: 34933724
After looking at the answers again I realized that fibo actually had it right.  So you get the points, fibo.
Thanks.
0
 
LVL 12

Expert Comment

by:geowrian
ID: 34933957
Actually, my answer does cover that scenario. But don't bother changing the answer/points.
0
 
LVL 29

Expert Comment

by:Bernard S.
ID: 34934077
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
 

Author Comment

by:steva
ID: 34937942
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
 
LVL 29

Expert Comment

by:Bernard S.
ID: 34940984
- 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

Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

606 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question