seo Question posted in
Some basic information to get you started with this can be found here.

Trying to style link with class – SEO

I have about 100 buttons in my website, all using JavaScript onclick method. I want to replace them all with regular <a href> links for SEO purposes.

I made new class called button_seo with the same CSS as the old buttons. I placed it in the global CSS file, but it will not work and my buttons have no styling.

It does works when I place the CSS in the same file where the button is, but I would like to place it in the global file so I can control many buttons at once.

What might cause this? I don’t have any style for the button_seo class anywhere in the files, just in global CSS file.

Here is my code:

    .button_seo {
      height: 40px ;
      background: linear-gradient(to bottom, #4eb5e5 0%, #389ed5 100%); /* W3C */
      border: none;
      border-radius: 5px;
      position: relative;
      border-bottom: 4px solid #2b8bc6;
      color: #fbfbfb;
      font-weight: 600;
      font-family: "Open Sans", sans-serif;
      text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
      font-size: 15px;
      text-align: center;
      text-indent: 5px;
      box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.2);
      cursor: pointer;
      width: 190px;
      left: 100px;
    }
<a class="button_seo" style="left:30px;" href='../censord' title='censord'>Click >></a>
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    i fixed it, can't use height and width parameters for link, that not button after all.


  2. 0

    As comment to your answer, is this what you want?

    .button_seo {
display: inline-block;
line-height: 40px; /* same as height */
  height: 40px ;
  background: linear-gradient(to bottom, #4eb5e5 0%, #389ed5 100%); /* W3C */
  border: none;
  border-radius: 5px;
  position: relative;
  border-bottom: 4px solid #2b8bc6;
  color: #fbfbfb;
  font-weight: 600;
  font-family: "Open Sans", sans-serif;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
  font-size: 15px;
  text-align: center;
  text-indent: 5px;
  box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  width: 190px;
  left: 100px;
}
     <a class="button_seo" style="left:30px;" href='../censord' title='censord'>Click >></a>

    EDIT – I found this SO

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search