如何使搜索按钮具有响应性?

时间:2019-03-28 19:14:54

标签: html css3 bootstrap-4

我的网站显示不正确,因为搜索按钮没有响应。如果您想在此处直播,请访问网站

https://emeupci.com

我尝试了col-md-4 col-lg-2,但没有成功。

这是我的搜索按钮的

  <div class="container-fluid headerimage" style="padding:0 !important">
                  <div class="col-md-12" style="padding:0 !important;">
                      <img class="img-fluid" src="{% static 'users/img/map.png' %}" alt="map" width="1200" height="500">
                       <div class="dropdown col-md-4 col-lg-2"  style="position: absolute; top: 170px; left: 390px;">
                           <button  onclick="myFunction()"
                                    class="dropbtn btn btn-primary btn-block dropdown-toggle col-md-4 col-lg-2"
                                    style=" border: 26px solid #f9f9f9;
                                         cursor: pointer; 
                                         font-weight: bold; background-color: #447193;
                                         color: white; padding: 8px; border-radius: 0px;
                                         font-size: 16px;);">Search for a church
                           </button>
                       <div id="myDropdown" class="dropdown-content">
                           <input type="text" placeholder="Search.." id="myInput" onkeyup="filterFunction()">
                           {% for country in country %}
                            <a href="{% url 'users:cities' country.pk %}">{{country.country}}</a>
                           {% endfor %}
                      </div>
                      </div>

当我缩小浏览器或在手机上打开网站时,我还希望按钮也缩小。

0 个答案:

没有答案