Element being replaced by   in WordPress back end

49
June 25, 2018, at 10:40 PM

I am adding category descriptions to WooCommerce. the descriptions look fine on desktop but are too long for a mobile device. As such, I am trying to show a snippet on mobile with the option of displaying more information. I am using code:

<div>
    <input id="post-1" class="read-more-state" type="checkbox" />
    <div class="read-more-wrap">
        <h2>Heading</h2>
        <p>Description Part 1</p>
        <div class="read-more-target">
           <div>Descpription part 2</div>
           <div>Description Part 3</div>
        </div>
    </div>
    <label for="post-1" class="read-more-trigger"></label>
</div>

I am adding CSS:

.read-more-state {
    display: none;
}
.read-more-target {
   opacity: 0;
   max-height: 0;
   font-size: 0;
   transition: .25s ease;
}
.read-more-state:checked ~ .read-more-wrap .read-more-target {
   opacity: 1;
   font-size: inherit;
   max-height: 999em;
}
.read-more-state ~ .read-more-trigger:before {
   content: 'Show more';
}
.read-more-state:checked ~ .read-more-trigger:before {
   content: 'Show less';
}
.read-more-trigger {
   cursor: pointer;
   display: inline-block;
   padding: 0 .5em;
   color: #666;
   font-size: .9em;
   line-height: 2;
   border: 1px solid #ddd;
   border-radius: .25em;
}

The CSS seems to work great however after saving the code, when I check the wordpress backend it has replaced the label with   and showing like so:

<div>
    <input id="post-1" class="read-more-state" type="checkbox" />
    <div class="read-more-wrap">
        <h2>Heading</h2>
        <p>Description Part 1</p>
        <div class="read-more-target">
            <div>Descpription part 2</div>
            <div>Description Part 3</div>
        </div>
    </div>
    &nbsp;
</div>

To add the code rather than just type I am changing from the visual tab to the text tab.

Is there any way I can prevent this and keep the label element in the code?

READ ALSO
Message ID of Sent email using IMAP (php)

Message ID of Sent email using IMAP (php)

I am trying to create a system that can automatically sort out emails that are sent and received from an email boxI want to match the sent emails to the received emails (sort of like threading)

79
Display stars based on what number I get from admin Wordpress

Display stars based on what number I get from admin Wordpress

I want to display stars based on number which I am getting from admin from ACF field, this is the code I have now

40
php get value from echoed array

php get value from echoed array

I am working on a project

62