为什么网站上的某些按钮不起作用？

Question

我是编码的新手，最近开发了一个网站，但是它存在一些问题。其中一些是不能完全起作用的按钮。为了完成这些按钮，我使用了<a>标签，以便人们在单击时被带到另一个页面。奇怪的是，我对所有代码都使用了相同的代码（例如<a class="connect-button" href="./contact.html">Inquire</a>），其中一些代码有效，而其他代码则无效。这是网站https://giacomosorbi.github.io/joanaoli09-module-i/index.html

例如，在主页的这一部分中，左右按钮起作用，而中间按钮甚至都不认为它们都具有完全相同的代码：

<h3 class="services-title">
                    Content <br />
                    Creation
                  </h3>
                  <div class="services-text">
                      Based on your project requirements, I’ll create/recreate the identity for your business and provide a wide range of content for you to use on different platforms as well as advise you on how to implement it. 
                  </div>
                  <div class="moreinfo-button">
                    <a href="./work.html">Know more</a>
                  </div>
                </div>
              </div>
              <div class="column">
                <div class="second-column">
                  <h3 class="services-title">
                    Strategy <br />
                    Session
                  </h3>
                  <div class="services-text">
                      You can book a strategy session with me so we can discuss your ideas and goals for your business. Similar sessions will repeat multiple times during the process of development of your Brand. Feel free to contact me if you would like to meet with me!
                  </div>
                  <div class="moreinfo-button">
                    <a href="./work.html">Know more</a>
                  </div>
                </div>
              </div>
              <div class="column">
                <div class="third-column">
                  <h3 class="services-title">
                    Brand <br />
                    Design
                  </h3>
                  <div class="services-text">
                      I’ll design and develop the identity of your brand based on your requirements and the briefing and strategy meetings. This will be a continuous process of ongoing communication between me and you. 
                  </div>
                  <div class="moreinfo-button">
                    <a href="./work.html">Know more</a>
                  </div>
                </div>
              </div>
            </div>
          </div> 

网站上的其他按钮（如主页末尾的“了解详情”按钮和“查询”按钮）以及其他页面中的其他按钮也是如此。

在这里您可以看到所有代码：https://github.com/GiacomoSorbi/joanaoli09-module-i

Answer 1

将这两个类<!-- Bootstrap CSS --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <div class="container"> <div class="row"> <div class="col-sm-6"> <h5 class="card-title col-form-label-lg" style="width:103%;background:pink; display: display;padding-left:10px;font-weight: bold">Fruits List </h5> <!-- My code start --> <div class="input-group mb-3"> <div class="input-group-prepend"> <label class="pr-3" for="colFormLabelSm">Serial Specifiction ID</label> </div> <input type="email" class="form-control" placeholder="" style="height:24px"> <span id="basic-addon1"> <a href="javascript:UserID('ID')"><img style="margin-left: 10px; margin-bottom:5px;" src="https://cdncontribute.geeksforgeeks.org/wp-content/uploads/GG-2.png" class="img-responsive" alt="Responsive image" class="img-rounded" alt="" width="25" height="20" /></a> </span> </div> <!-- My code end here --> <div class="form-group row" style="margin-left: auto"> <label for="colFormLabelSm" style="width:40%;">Name</label> <div> <input type="email" class="form-control form-control-sm" id="colFormLabelSm" placeholder="" style="width:103%;height:24px"> </div> </div> <div class="form-group row" style="margin-left: auto"> <label for="colFormLabelSm" style="width:40%;">Alias</label> <div> <input type="email" class="form-control form-control-sm" id="colFormLabelSm" placeholder="" style="width:103%;height:24px"> </div> </div> <div class="form-group row" style="margin-left: auto"> <h5 class="card-title col-form-label-lg bg-warning" style="width:100%;background:pink; display: display;padding-left:10px;font-weight: bold">DESCRIPTION</h5> <textarea class="form-control" rows="5" id="comment"></textarea> </div> </div> <div class="col-sm-6"> <h5 class="card-title col-form-label-lg" style="width:100%;background:pink; display: display;padding-left:10px;font-weight: bold">Sub Category</h5> <div class="form-group row" style="margin-left: auto"> <label for="colFormLabelSm" style="width:40%;">Classification</label> <div> <select class="form-control" id="sel1" style="width:326%;height:24px"> <option>1</option> </select> </div> </div> <div class="form-group row" style="margin-left: auto"> <label for="colFormLabelSm" style="width:40%;">No of orders</label> <div> <input type="email" class="form-control form-control-sm" id="colFormLabelSm" placeholder="" style="width:103%;height:24px"> </div> </div> <div class="form-group row" style="margin-left: auto;display:block ruby"> <label for="colFormLabelSm" style="width:40%;">Ordered by</label> <div class=""> <input type="email" class="form-control form-control-sm" id="colFormLabelSm" placeholder="" style="width:103%;height:24px"> </div> </div> <div class="form-group row" style="margin-left: auto"> <h5 class="card-title col-form-label-lg" style="width:100%;background: pink; display: display;padding-left:10px;font-weight: bold">CONTACTS</h5> </div> <div class="form-group row" style="margin-left: 5px;display:block ruby"> <label for="colFormLabelSm" style="width:40%;">Ordered Contact Name</label> <div> <select class="form-control" id="sel1" style="width:326%;height:24px"> <option>1</option> </select> </div> </div> <div class="form-group row" style="margin-left: auto"> <h5 class="card-title col-form-label-lg" style="width:100%;background:pink; display: display;padding-left:10px;font-weight: bold">Customer Specific Details </h5> </div> <div class="form-group row" style="margin-left: 5px;display:block ruby"> <label for="colFormLabelSm" style="width:86%;">Existing Customer</label> <div> <select class="form-control" id="sel1" style="width:326%;height:24px"> <option>YES</option> <option>NO</option> </select> </div> </div> </div> </div> </div>和.what-i-do的css更改为以下所有.connect-title标签都应起作用。

<a>