HTML-Dropdown (Auswahl) mit Textumbruch und Rahmen nach jedem Wert (Option)

Ich versuche mit DropDown zwei Dinge zu erreichen.

Zuerst möchte ich den Text in die Liste der Optionen in einem Dropdown-Menü einschließen.Zweitens möchte ich nach jeder Option eine Grenze setzen

und ich möchte IE (und andere Browser auch) unterstützen.

Das liegt daran, dass ich in der Dropdown-Liste langen Text hätte und diese nicht ausschneiden möchte. Aus diesem Grund möchte ich die oben genannten Dinge tun.

Etwas wie das:-

http://jsfiddle.net/fnagel/GXtpC/embedded/result/

Wählen Sie die mit "Gleich mit Option Textformatierung, Wählen Sie eine Adresse". Beachten Sie, wie die Optionen formatiert sind und mit jedem von ihnen einen unteren Rand haben.

Folgendes habe ich versucht (Text):

.myselect {
  width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.myselect option {
  white-space: nowrap;
  width: 100% border-bottom: 1px #ccc solid;
  /* This doesn't work. */
}
<select name="d" class="myselect">
  <option value="sdf" class="test1"> line text How to wrap the big line text </option>
  <option value="sdf2" class="test1"> line text How to wrap the big line text </option>
  <option value="sdf3" class="test1"> line text How to wrap the big line text </option>
  <option value="sdf4" class="test1"> line text How to wrap the big line text </option>
</select>

Antworten auf die Frage(2)

Ihre Antwort auf die Frage