Kevin Powell - Community•7mo ago

Need help with CSS button classes

Hello, I'm making a small school project and am using a single class for all of my buttons on this specific page. Every button works as intended except the last one, titled "История и дейност на фирмата". It's in bulgarian, it's on line 184. For some reason the code breaks with that button and on refresh I only see the text for a second before it fades to the background color. Same issue happens when I hover or unhover it with my mouse. Would love to know what I did wrong, thanks in advance. Pastebin for the code: https://pastebin.com/pR96bRVn

Pastebin

Pastebin.com is the number one paste tool since 2002. Pastebin is a website where you can store text online for a set period of time.

2 Replies

MarkBoots•7mo ago

there are 2 selectors acting on the last button. .btn and .contact-section a

<div class="contact-section">
    <a href="istoriq.html" class="btn">История и дейност на фирмата</a>
</div>

<div class="contact-section">
    <a href="istoriq.html" class="btn">История и дейност на фирмата</a>
</div>

you have

.btn {
  display: inline-block;
  padding: 10px 20px;
  background-color: #d62020;
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
  transition: background-color 0.3s ease;
}
 
.btn:hover {
  background-color: #b31616;
}

.btn {
  display: inline-block;
  padding: 10px 20px;
  background-color: #d62020;
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
  transition: background-color 0.3s ease;
}
 
.btn:hover {
  background-color: #b31616;
}

and

.contact-section a {
  color: #d62020;
  font-weight: bold;
  text-decoration: none;
  transition: color 0.3s ease;
}
.contact-section a:hover {
  color: #b31616;
}

.contact-section a {
  color: #d62020;
  font-weight: bold;
  text-decoration: none;
  transition: color 0.3s ease;
}
.contact-section a:hover {
  color: #b31616;
}

so the color and transition properties will be overwritten.

kaloyanOP•7mo ago

oh wow I dont even need the contact-section to interact with the button at all, sleepy code thank you

Gaming

Programming

Need help with CSS button classes