Css HTML选择下拉列表文本包装在ajax更新后停止工作

我有一个地址的html选择下拉列表。有些地址很长，超出父div边界

我做了家庭作业，发现css规则解决了这个问题：

select, option { width: __; }

此下拉列表是支持ajax的表单的一部分。当用户在其他地区更改时，地址字段的选项将更改

现在我发现只要选项相同，css规则就可以正常工作。一旦我做了一些导致选择选项被ajax更改的事情，css规则就失去了控制。“选择选项”字段将恢复为原始的单行表单，该表单脱离了边框

我已经检查了选项更改前后的html标记，以检查select结构和ID是否完整。发现元素结构相同，select元素id没有变化

那么，为什么css规则在选项更改时失去了它的保留

这种行为发生在IE、Firefox和Chrome中

我正在使用Drupal7及其表单，ajax框架

更新：代码

我使用的是Drupal7，所以实际上我没有编写JS代码。我只能在这里显示PHP和CSS：

表格：

---

CSS规则丢失可能是因为AJAX更新后选择器无效。如果有多个同名元素，Drupal中的表单元素ID将具有自动递增的数字后缀。检查标记并尝试调整CSS规则。您甚至可以通过添加以下内容为这些元素设置自己的类名：

$form['shipping_address']['ship_to_address']['#attributes']['class'][] = 'my-own-class-to-target-with-css';

---

此外，粘贴的代码不包含带结束符的后缀属性，这也可能导致其他问题。

能否显示更多代码？使用JSFIDLE也是一个好主意

select#edit-ship-to-address, select#edit-bill-to-address {
  width: 60%;
}

$form['shipping_address']['ship_to_address']['#attributes']['class'][] = 'my-own-class-to-target-with-css';