Does anyone know how this website Travel Mail are doing their rounded corners, especially the Lastest Travel News box? From what I can tell there are no background images and they aren't using html5 or javascript.

2 answers

danwellman 5600
0
points

They are using spans and background-images. You can see this in Firebug (other DOM explorers are available...)

Answered almost 6 years ago by danwellman
  • Weird, I looked in Firebug but I didn't see anything about background images or spans. http://img638.imageshack.us/img638/211/travelmail.jpg Can you post a screenshot? Paul Sheldrake almost 6 years ago
  • here is a screenshot: http://t.co/PFKG3j4 :) danwellman almost 6 years ago
0
points

Below is the code for the active list item with the tab. The two corner background images are very small images that are part of a sprite. They go in the two spans above the span that surrounds the link.

<li class="travel">
<span class="tl">&nbsp;</span>
<span class="tr">&nbsp;</span>
<span class="link-wocc linkro-wocc">
<a href="/travel/index.html">Travel</a>
</span>
</li>
Answered almost 6 years ago by Artistic Abode