Question

Hi all having a few problems with my CSS
I am trying to highlight a link on the navigation based on the page the user is on.

I have this style which works as I would like it to do, but when I pass a query-string into pcisHPprofile.aspx the CSS is not working. Does anyone know how i can get this style to work with query-strings?

 body form[action="pcisHPprofile.aspx"] #btnuser

{
    padding: 18px 4px 5px 4px;
    background-image: url(../images/tabbluleft.gif) ;
    background-repeat:no-repeat; 
    color: #fff;

}



<div id="nav" class="nav" >

      <ul>
       <li id="tab1">
       <a id="btnsession" href="pcissessionlist.aspx" > <span >Session</span></a>
         </li>
          <li id="tab2">
              <a id="btnsystem" href="pcissystemsettings.aspx" > <span >System Settings</span></a>
            </li>
          <li id="tab3">
          </li>
          <li id="tab4">
                            <a id="btnuser" href="pcisuserlist.aspx" > <span >User Logins</span></a>
              </li>
          <li id="tab5">
                                          <a id="btninterpreter" href="pcisinterpreterlist.aspx" > <span >Interpreter Profile</span></a>

              </li>
       <li id="tab6"><asp:LinkButton ID="btnreports" runat="server" Visible="false" cssid="cssreports" PostBackUrl="#"><span>Reports</span></asp:LinkButton></li>
      </ul> 

    </div>

Answer 1

I assume that the #btnuser ARE some buttonS inside the some forms, where one of the forms have action=”pcisHPprofile.aspx”?

If that is correct, then your error is the fact that you have many buttons with the same id attirbute id=”btnuser”. The ID attibute MUST be uniqe on the page. change the id=”btnuser” to class=”btnuser” on the buttons and your selector from:

body form[action="pcisHPprofile.aspx"] #btnuser {
}

to

body form[action="pcisHPprofile.aspx"] .btnuser {
}

Then it should work.

In the first form it might work only if the FIRST button with id=”btnuser” is actually inside the form with action=”pcisHPprofile.aspx”. If it is inside any other form, then it will not work.

Best regards,
SWilk

UPDATE:

After OP updated the question, I think that this form of selector should work:

body form[action^="pcisHPprofile.aspx"] #btnuser {
...
}

It would a element with id=btnuser inside a form, which action begins with “pcisHPprofile.aspx”. It would not matter if the acutal action attibute contain only “pcisHPprofile.aspx” or “pcisHPprofile.aspx?any-parameters&and=some-values”.

Best regards,
SWilk