Bing Twitter maps

Posted April 4th, 2010 in Labs by Mario Seijo

Bing maps recently added the ability to add custom Twitter feeds into their maps, it’s called Bing Twitter maps. The map uses Silverlight 3 by default, but the nice part about it is this: If you don’t have Silverlight installed, the map falls back to plain Javascript, which is recognized by all web browsers.  I took Microsoft up on their offer and plugged my Twitter feed into their maps.  The code is super easy to implement and add to your own site.

HTML code:

<iframe src=”http://www.bing.com/twitter/maps/embed?version=1.0&eid=769766769&user=exposedelements” width=”600″ height=”400″ scrolling=”no” frameborder=”0″></iframe>

This demo shows my Twitter feed and Bing maps.

How about you?

I’d love to hear from you if you are using the Bing maps API; go ahead and post your links in the comments section.

How to add the service mark symbol with HTML

Posted January 23rd, 2010 in Code by Mario Seijo

HTML has a tag known as <sup> which stands for superscript text. This tag properly places text half a character above the baseline.

Example:
bite size technology, design and marketing ideasSM

In order to achieve the service mark symbol as you see above, you need to align your “SM” text to the top of its line-height and decrease the font size to 50% of its original size. The following code samples will produce the service mark symbol on your web pages.

CSS code:

sup { vertical-align: text-top; font-size: 50%; }

HTML code:

bite size technology, design and marketing ideas<sup>SM</sup>

Let me know in the comments section if this code helps you, or better yet, share it with others who might need it.

Switch to our mobile site