How to Make CSS A:Active Work After the Click

How to make css a:active work after the click?

From your demo link in the comments on another answer, JavaScript will not be of any help, it should be done in your PHP code.
Something in the lines of:

<a <?php if (this_tab_is_selected){ ?>class='active' <?php } ?>href='LINK_TO_TAB' >
    TAB_NAME
</a>

Mentioning that changing tabs is redirecting to another page could have helped with better responses from the start xD

Depending on your code and how you are creating the tabs, you need to change the this_tab_is_selected to a code that returns true for the selected tab.

P.S. You still need to make the modification mentioned in the other answer in your CSS. (Which is to change #navigation a:active to #navigation a.active)

CSS :active only works during a click

your can try this by using checkbox if you want to do it with NO js only css

[type="checkbox"]{  display:none;}.fave {    width: 70px;    height: 50px;    background: url(https://cssanimation.rocks/images/posts/steps/twitter_fave.png) no-repeat;    background-position: 0 0;    display: inline-block;    }
[type="checkbox"]:checked ~ .fave {    background-position: -3519px 0;    transition: background 1s steps(55);}

<input type="checkbox" id="cb1"><label class="fave" for="cb1"></label>

keeping a: active until another link is clicked

HTML: (Added onclick="clickSingleA(this)" and class="single" attributes.)

To have one of the links activated by default, just add active class

<div align="right"><a onclick="clickSingleA(this)" class="single active" href="me1.cfm?pic_ws=80&typ=1" target="mnfrm3">ME1</A></div><br>
<div align="right"><a onclick="clickSingleA(this)" class="single" href="me2.cfm?pic_ws=80&typ=1" target="mnfrm3">ME2</A></div><br>
<div align="right"><a onclick="clickSingleA(this)" class="single" href="me3.cfm?pic_ws=80&typ=1" target="mnfrm3">ME3</A></div><br>

CSS: (added a.active)

a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #C65B05;
}

a:hover, a.active   
{
    text-decoration: none;
    color: #03B003;
}

JavaScript: (function to activate links, and remove old active)

function clickSingleA(a)
{
    items = document.querySelectorAll('.single.active');

    if(items.length) 
    {
        items[0].className = 'single';
    }

    a.className = 'single active';
}

How can I keep a css :active style after I release my mouse on a bootstrap navbar li

You can't keep :active after releasing the mouse button because that is not how it works.

Here are a couple of options, one javascript/jquery, the other CSS and HTML

Jquery

Clean, concise and flexible

$(document).ready(function() {
  $(".nav-pills a").click(function() {
    $(".nav-pills a").removeClass("active");
    $(this).addClass("active");
  });
});

css

.nav-pills > li > a:active,
.nav-pills > li > a.active {
  border-bottom: 5px solid white;
}

$(document).ready(function() {  $(".nav-pills a").click(function() {    $(".nav-pills a").removeClass("active");    $(this).addClass("active");  });});

.menupartial {  background-color: #16749F;  opacity: .9;  width: 100%;}.menupartial a {  color: lightgrey;  font-weight: bold;}.nav-pills > li > a {  border-radius: 0;}.nav-pills > li > a:hover {  border-radius: 0;  background-color: #16749F;  color: white;}.nav-pills > li > a:active,.nav-pills > li > a.active {  border-bottom: 5px solid white;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><div class="row menupartial">  <div class="col-md-12">    <ul class="nav nav-pills">      <li>@Html.ActionLink("User", "UserProfile", "Account")</li>      <li>@Html.ActionLink("Profiles", "Index", "Profile")</li>      <li>@Html.ActionLink("Spaces", "Index", "Space")</li>      <li><a href="#">Your Schedules</a>      </li>      <li><a href="#">Your Messages</a>      </li>      <li><a href="#">Your Groups</a>      </li>      <li><a href="#">Your Friends</a>      </li>    </ul>  </div></div>

CSS change button style after click

If you're looking for a pure css option, try using the :focus pseudo class.

#style  {
    background-color: red;
}

#style:focus {     
    background-color:yellow;    
}

How to Make CSS A:Active Work After the Click