無法擺脫ExtJS中hr標籤的邊框javascript頁面

Question

我有一個ExtJS Web應用程序，其中有幾個hr標籤。問題是，無論我做什麼，線條都以邊框呈現 - 無論我指定隱藏的邊框樣式還是無邊框樣式 - 邊框仍顯示出來。

這裏是我的代碼

var newForm = new Ext.form.FormPanel({ 
    header: false, 
    monitorValid: true, 
    height: 390, 
    width:800, 
    layout: new Ext.layout.FormLayout, 
    forceLayout: true, 
    padding: 5, 

    items: [ { 
       html: "<hr>", style: 'display: block;margin-top: 0.5em; margin-bottom: 0.5em; margin-left: auto; margin-right: auto; border-style: hidden;' 
      } 
    ] 
    }); 

而且它產生如下：

有什麼建議？

在此先感謝

Answer 1

有了這個difinition

items: [ 
    { 
     // Actually you add panel 
     // xtype: 'panel', 
     html: "<hr>", 
     style: 'display: block;margin-top: 0.5em; margin-bottom: 0.5em; margin-left: auto; margin-right: auto; border-style: hidden;' 
    } 
] 

添加Ext.panel.Panel您Ext.form.FormPanel（因爲defaultType）項目。

當您應用style時，您實際上已將其添加到此Ext.panel.Panel DOM元素中，而不是您的<hr>元素。

你必須添加樣式<hr> difinition

html: "<hr style='display: block;margin-top: 0.5em; margin-bottom: 0.5em; margin-left: auto; margin-right: auto; border-style: hidden;'>" 

Here is simple fiddle