在html中重疊城市下拉列表，css

我有2個下拉列表，州和城市。選擇州，特定的城市下拉列表可見。但所有的城市下拉不重疊，搞亂了外觀。我需要一種方式來重疊所有的城市下拉菜單。在html中重疊城市下拉列表，css

下面是減少的html，我需要添加什麼來解決這個問題？

我需要添加這部分一些CSS（城市）style="height: 30px;__something here___"

<select class="input-txt" style="height: 30px;" name="Standard" 
        onchange="showDiv(this.value);"> 
         <option selected="selected"> 
         Select 
         </option> 

         <option value="ap-adilabad"> 
         Adilabad 
         </option>

砍倒HTML below1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 

    <title></title> 
</head> 

<body> 
    <div class="title"> 
    Need some support? Get in touch with our authorized service centers... 
    </div> 

    <table class="responsive-table" style= 
    "width: 100%; border-width: 0; border-spacing: 0; margin: 0 auto;"> 
    <tbody> 
     <tr> 
     <td style="text-align: left; vertical-align: top;"> 
      <div class="fix"></div> 

      <table style= 
      "width: 100%; border-width: 0; border-spacing: 0; margin: 0 auto;"> 
      <tbody> 
       <tr> 
       <td class="responsive-td1" style="width: 39%;"> 
        <h2>Select State</h2> 
       </td> 

       <td class="responsive-td2" style="width: 5%;"></td> 

       <td> 
        <h2>Select City</h2> 
       </td> 
       </tr> 

       <tr> 
       <td class="responsive-td3"><select class="input-txt" style= 
       "height: 30px;" name="search" onchange="showS(this.selectedIndex)"> 
        <option selected="selected" value="0"> 
        Select 
        </option> 

        <option value="andhra"> 
        Andhra Pradesh 
        </option> 

        <option value="assam"> 
        Assam 
        </option> 

       </td> 

       <td style="width: 4%;"></td> 

       <td class="responsive-td4"> 
        <div id="containerSelect"> 
        <select class="input-txt" style="height: 30px;" name="Select"> 
         <option selected="selected"> 
         Select 
         </option> 
        </select> <!--Andhra Pradesh--> 
        <select class="input-txt" style="height: 30px;" name="Standard" 
        onchange="showDiv(this.value);"> 
         <option selected="selected"> 
         Select 
         </option> 

         <option value="ap-adilabad"> 
         Adilabad 
         </option> 

         <option value="ap-anantapur"> 
         Anantapur 
         </option> 
        </select> <!--Assam--> 
        <select class="input-txt" style="height: 30px;position:absolute" name="Standard" 
        onchange="showDiv(this.value);"> 
         <option selected="selected"> 
         Select 
         </option> 

         <option value="as1"> 
         Guwahati 
         </option> 

        </select> <!--BIHAR--> 

        </div> 
       </td> 
       </tr> 
      </tbody> 
      </table>&nbsp; 

      <div id="SkiDiv"> 
      </div> 
     </td> 
     </tr> 
    </tbody> 
    </table> 
</body> 
</html>

來源

2014-12-20 Siddharth

Runnable片斷丟失。 – idmean

這可以在任何基於在線html的預覽上運行。 – Siddharth

你首先要對所有城市的「display: none」設置下拉菜單，然後，當您選擇一個州showS時，可以將相應的城市下拉菜單設置爲「display: inline-block」。

來源

2014-12-20 15:21:21

在html中重疊城市下拉列表，css

回答

相關問題