PHP if Else Style button color

Hi Experts,

I am trying to figure out a little problem I'm having on my dev site.

I have a job listing site, which every single job listing has an application button.  

The jobs are separated into 3 categories  (DryVan (cretecarrier), Refrigerated (shaffer), FlatBed(hunt))  and the link in the application button on each listing will goto either cretecarrier, hunt or Shaffer.

ok, what i would like to do is have the button either Red, Blue or Maroon, depending on what job type it is. The class in the button is exactly the same, so i don't know how i can target the color. What is different is the url link.  I was wondering if it's possible to change the color based on the link, or how would i change it?

Here are links to 3 jobs

CreteCarrier - want this button red
Shaffer - want this button blue
Hunt - want this button marron.

Can you help?  Thank you Experts
Jon ImmsWeb DeveloperAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

gr8gonzoConsultantCommented:
Add this to your CSS:

a.application_button[href*="/shaffer"]
{
  background-color: #00f;
}

a.application_button[href*="/cretecarrier"]
{
  background-color: #f00;
}

a.application_button[href*="/hunt"]
{
  background-color: #800000;
}

Open in new window


This basically looks for <a> links that use the application_button class that also contain certain strings within their "href" attributes, and then defines that style.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Leonidas DosasCommented:
You can add in the css settings this depending on the href value
a[href="https://intelliapp2.driverapponline.com/c/cretecarrier"] {
        background-color: rgb(255, 15, 13);
}

Open in new window

0
Jon ImmsWeb DeveloperAuthor Commented:
brilliant,  I did not know I could do that in the CSS. Learn something every day.  Thank you.
0
Julian HansenCommented:
I did not know I could do that in the CSS
Just because you can does not mean you should. First prize will always being able to give your button (or its container) a specific class linked to the category.

If you should ever change your URL structure you are going to break your styling - that is not good practice - to have your style dependent on content.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.