无法将文本输入表单或单击搜索按钮

时间:2015-12-31 04:34:36

标签: html css wordpress

知道为什么这段代码停止工作了吗? (WordPress的)

My site - 主要搜索栏“城市”'邻居''最低价格'等没有响应,我无法输入文字,也不知道我做了什么来搞砸它。< / p>

The code似乎很干净,但是当我在codepen中输入它时,我的网站上的某些内容正在破坏它!

    <form id="sp_search_w" action="http://www.codytritter.com/listing/" method="get">
        <input name="sp" type="hidden" value="s" /> 
        <label for="sp_city">City</label> 
        <input id="sp_city" class="btn-block" name="sp_city" type="text" placeholder="City" /> 
        <label for="sp_subdivision">Sub Division</label> 
        <input id="sp_subdivision" class="btn-block" name="sp_subdivision" type="text" placeholder="Neighborhood" /> 
        <label for="sp_minprice">Min. Price</label> 
        <input name="sp_minprice" type="text" placeholder="Min Price" /> 

        <!--
        <select name="sp_minprice" id="sp_minprice" class="btn-block">
           <option value="0">No Min</option>
           <option value="25000">25,000</option>
           <option value="50000">50,000</option>
           <option value="75000">75,000</option>
       </select>
       --> 

       <label for="sp_maxprice">Max. Price</label> 
       <input name="sp_maxprice" type="text" placeholder="Max Price" /> 

       <!-- 
       <select name="sp_maxprice" id="sp_maxprice" class="btn-block">
           <option value="50000000">No Max</option>
           <option value="25000">25,000</option>
           <option value="50000">50,000</option>
           <option value="75000">75,000</option>
       </select> 
       --> 

       <label for="sp_bedrooms">Bedrooms</label> 
       <input class="short" name="sp_bedrooms" type="text" placeholder="Beds" /> 
       <!--
       <select name="sp_bedrooms" id="sp_bedrooms" class="input-small btn-block">
           <option value="">All</option>
           <option value="2">2</option>
           <option value="3">3</option>
           <option value="4">4+</option>
       </select> 
       -->

       <label for="sp_bathrooms">Bathroom</label> 
       <input class="short" name="sp_bathrooms" type="text" placeholder="Baths" />

       <!--
       <select name="sp_bathrooms" id="sp_bathrooms" class="input-small btn-block">
           <option value="">All</option>
           <option value="2">2</option>
           <option value="3">3</option>
           <option value="4">4+</option>
       </select>
       -->
       <div class="controls">
            <input id="sp_search_submit" class="btn" type="submit" value="Search" />
       </div>
   </form>

CSS

form { 
   max-width: 100%; 
   margin: auto; 
   text-align: center; 
} 

 input { 
   text-align: center; 
   padding: 1rem 1rem; 
   border-radius: .5rem; 
   border: 2px solid #ddd; 
   font-size: 1.3em; 
   max-width: 8em; 
 } 

 .controls { padding: 1em 0 0; }

 #sp_search_submit { 
   background: #809eb6; 
   border: 0; 
   color: #fff; 
   text-transform: uppercase; 
   letter-spacing: .2rem; 
 } 

 input:focus { outline: 0; } 
 .short { max-width: 4em; } 
 label { display: none; } 

1 个答案:

答案 0 :(得分:2)

这是一个CSS问题。父元素上有z-index -1。

看到这种风格

.post-489 .et_pb_section:nth-child(1) {
    z-index: -1!important;
}

它在您页面的头部引用

<!-- Start CSSHero.org Dynamic CSS & Fonts Loading -->
<link rel="stylesheet" type="text/css" media="all" href="http://www.codytritter.com?wpcss_action=show_css" data-apply-prefixfree />
<!-- End CSSHero.org Dynamic CSS & Fonts Loading -->