Dwie zależne od siebie drop listy.

pytanie zadane 29 stycznia 2018 w HTML i CSS przez DudSon Użytkownik (680 p.)

Cześć, jak zrobić w html podwójną drop listę. Chodzi mi dokładnie o to, że w jednej drop liście wybieram np.: Dolnośląski a w drugiej pojawiają mi się dopiero teraz opcje i są to miasta z dolnego śląska a jak cofnę się i zmienię w pierwszej na Kujawsko-Pomorskie to w drugiej mam do wyboru miasta z Kujawsko-Pomorskiego województwa.

1	komentarz 29 stycznia 2018 przez lapacz.kornel Mądrala (6,930 p.) a JS znasz?

komentarz 29 stycznia 2018 przez pablop76 VIP (123,180 p.)

Chodzi o listę zagnieżdżoną, czy dwie listy obok siebie?

komentarz 29 stycznia 2018 przez pablop76 VIP (123,180 p.)

A może wystarczy optgroup

komentarz 31 stycznia 2018 przez DudSon Użytkownik (680 p.)

@lapacz.kornel,
Coś niecoś znam.

komentarz 31 stycznia 2018 przez DudSon Użytkownik (680 p.)

Wolałbym obok siebie, ale jak się nie uda to zrobię tak jak proponujesz optgroup

komentarz 31 stycznia 2018 przez pablop76 VIP (123,180 p.)

No więc czy nie może to być lista zagnieżdżona?

<ul>
  <li>Wybierz województwo
  <ol>
  <li>łodzkie
    <ul>
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li>4</li>
      <li>5</li>
    </ul>
  </li>
  <li>mazowieckie
    <ul>
      <li>2/1</li>
      <li>2/2</li>
      <li>2/3</li>
      <li>2/4</li>
      <li>2/5</li>
    </ul>
  </li>
  <li>pomorskie
    <ul>
      <li>3/1</li>
      <li>3/2</li>
      <li>3/3</li>
      <li>3/4</li>
      <li>3/5</li>
    </ul>
  </li>
</ol>
 </li>
</ul>

ul li ol{
  display: none;
}
ul li:hover ol{
  display: block;
}
ol li{
  width: 200px;
  height: 30px;
  background-color: green;
  text-align: center;
}
ol li ul{
  display: none;
}
ol li:hover ul{
  display: inline-block;
  margin-left: 160px;
}
ol li ul li{
  background-color: red;
}