5

Working to put a href in a span class, but I cant get the href link to work.

<a href="../../public/bassengweb/logout">Logg ut<span class="label label-danger"></span></a>

Also the label-danger wont show up.

user3185936
  • 1,567
  • 6
  • 23
  • 44
  • shouldn't it be the other way round (anchor embedded in the span) if you wish the class to cover the `a` element ? why don't you assign the class to `a` ? what do you mena by "does't show up" ? – collapsar Apr 10 '14 at 08:06
  • You [don't want to use a GET for logging out](https://stackoverflow.com/a/14587231/6083675). – Laurel Nov 21 '21 at 21:14

4 Answers4

6

Link to working span - Bootply

That's because of this line in the CSS:

.label:empty{
  display:none;
}

If you write something between the span tags, it will work.

<a href="../../public/bassengweb/logout"><span class="label label-danger">Logg ut</span></a>

Although, it will look terrible with 'normal' bootstrap label when hovered, maybe do something like this:

<a href="../../public/bassengweb/logout">Logg ut</a><span class="label label-danger">Danger</span>
Albzi
  • 15,431
  • 6
  • 46
  • 63
6

This is the best way! It works easy and clean.

<span onclick="window.location.href='www.google.com';">text</span>

and then you can give it a class:hover for the color

phwt
  • 1,356
  • 1
  • 22
  • 42
Hugo
  • 69
  • 1
  • 1
  • 1
    This is [terrible for accessibility](https://karlgroves.com/2013/05/14/links-are-not-buttons-neither-are-divs-and-spans). It cannot be accessed with a keyboard, and prevents many other interactions such as right click, shift+click, drag+drop. – Laurel Nov 21 '21 at 21:04
1

The <span> with class label should have content, check the Boostrap's example Boostrap Component - Label Maybe you should try to put an "x"

<a href="../../public/bassengweb/logout">Logg ut<span class="label label-danger">x</span></a>

or use glyphicons, maybe 

<a href="../../public/bassengweb/logout">Logg ut<span class="label label-danger"><span class="glyphicon glyphicon-circle-arrow-right"></span></span></a>
jeugen
  • 344
  • 4
  • 23
0

For label css use:

class="label label-important"

it worked for me

Aleksandra Kuna
  • 35
  • 8