Why does a <label>tag</label> make my "tag" disappear?

PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!

Moderator: General Moderators

Post Reply
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Why does a <label>tag</label> make my "tag" disappear?

Post by simonmlewis »

I am using the <label> tag to make it easy for using to put a tick into a checkbox.
However, when I wrap the tag around the text, the text disappears.

Is there some common reason why this might happen?
I haven't got any "label" CSS going on.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
Weirdan
Moderator
Posts: 5978
Joined: Mon Nov 03, 2003 6:13 pm
Location: Odessa, Ukraine

Re: Why does a <label>tag</label> make my "tag" disappear?

Post by Weirdan »

simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Why does a <label>tag</label> make my "tag" disappear?

Post by simonmlewis »

OH yes, I have another page where it DOES work. I don't know what could stop it working, is my question.
I have no "label display:none" type code, so what could do it?
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Why does a <label>tag</label> make my "tag" disappear?

Post by simonmlewis »

http://jsfiddle.net/simon_a6/nxbcax6t/1/

Works for me too - so there must be something in my code that's killing it.
What could stop it working though?
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Why does a <label>tag</label> make my "tag" disappear?

Post by simonmlewis »

Ok I have found the issue, though not sure why this stopped it showing, but in another CSS I had this:

Code: Select all

 label:not(.arrows):not(.show-description-label) {
    position: absolute;
    left: 50%;
    bottom: -45px;
    z-index: 100;
    width: 15px;
    height: 15px;
    background-color: rgba(200,200,200,1);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition: background-color .2s;
    -moz-transition: background-color .2s;
    -o-transition: background-color .2s;
    transition: background-color .2s;
}
I've commented it out and it all still works, and the label displays.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
Post Reply