[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 4787
  • Last Modified:

CSS - text-decoration: underline

Is it possible to set text-decoration underline underline styles?

e.g. like double underline or even double accounting or single accounting ones?
0
ycomp
Asked:
ycomp
  • 2
  • 2
1 Solution
 
ZylochCommented:
For Mozilla browsers, you can set a double underline with nested <span> tags:

<span style="text-decoration:underline;"><span style="text-decoration:underline;vertical-align:4px;">Your text</span></span>

This will not work on IE, unfortunately, so you can use an IE-hack and set border-bottom to double like this:

<span style="text-decoration:underline;_text-decoration:none;"><span style="text-decoration:underline;vertical-align:4px;_text-decoration:none;_border-bottom:3px double;">Your text</span></span>

The _ before the style means IE-only (as of now at least)

I'm not sure what you mean by double accounting and single accounting, though...

Regards,
${Zyloch?
0
 
ycompAuthor Commented:
thanks Zyloch.

I'm sure if double underline is not natively supported by CSS then double and single accounting underline (like in Excel) is not natively supported either.
0
 
seanpowellCommented:
Hmmm, if I may - a lot of unecessary code and IE only hacks there :-(

<span style="border-bottom: double red;">Your text</span>

or for links

a.special
{
border-bottom: double red;
}

<a href="" class="special">Your text</a>
0
 
ycompAuthor Commented:
cool sean, your code will come in useful.
0
 
ZylochCommented:
Yah, some unnecessary code, but I was just showing all the ways to do it :)
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

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