Have problem with my web project

I have set up a web which has two html files and one css file:
Index.html and AboutUs.html
styleIndex.css-- support for both two htmls

so, I want to set up btn to connect each page.
Bascially all the btns in these two HTML files will be all no border; therfore, I set up the “border=0;” in css
so, it is working in individual btn’s css package.
but I want to set up a class for btns in entire website, so I was trying to set up btnAll class that:
.bthAll{
border=0px;
}

it is not working at all…
so maybe someone can help me out… thanks

Index.html:

<div class="buttonIndexMenu btnAll”>
<h1 class="buttonIndexMenu1">About Us</h1>
<button class="buttonIndexMenu2"; onclick="self.location.href='./aboutUs.html'; ">
    <img class="bottonImage2" src= "./logo.jpg"></button>
</div>

AboutUs.html:
 <div class="btnAll">
    <button class="buttonAboutUsMenuIndex"; onclick="self.location.href='./index.html'">
        back to Index page</button>
    </div>

styleIndex.css:
.btnAll{
  border: 0px;
}

.buttonIndexMenu{
  font-family: 'Fascinate', cursive;
  font-size:15px;
  width: 50px;
  color:green;
  }
.buttonIndexMenu1{
  background-color: blue;
  width: 100px;
  height: 100px;
  position: absolute;
  margin: auto;
  top: 70%;
  left: 20%;
}

.buttonIndexMenu2{
  background-color:transparent;
  width: 60px;
  height: 60px;
  position: absolute;
  margin: auto;
  top: 50%;
  left: 80%;
}

.bottonImage2{
 width:60px;
 height:60px;
}

.buttonAboutUsMenuIndex{
  background-color:greenyellow;
  width: 60px;
  height: 60px;
  position: absolute;
  margin: auto;
  top: 20%;
  left: 30%;
}

Hello :slight_smile:

There are few things that I would like to note before answering your question.


  1. <button class="buttonIndexMenu2"; onclick="self.location.href='./aboutUs.html'; "> In HTML we do not use semicolons to separate atributes, single space is enough:
<button class="buttonIndexMenu2" onclick="self.location.href='./aboutUs.html'; ">
  1. <div class="buttonIndexMenu btnAll”> The second quotation mark is not a standard one, so the value of class atribute is not properly closed, use standard quotation marks:
<div class="buttonIndexMenu btnAll">

Back to your question. Class btnAll is applied to the div elements, not to the button elements. Assign this class to the button elements or change the selector to .btnAll>button.

2 Likes

@factoradic Thanks for your answer.
You just saved my day !!

1 Like

You’re welcome :slight_smile:

2 Likes