Twitter Bootstrap, fieldet efsanesinin oluşturulmasını değiştiriyor, neden?

Question

Bu ASP.NET MVC 3 projesinde, Twitter Bootstrap ile deneme yapmaya yeni başladım, ancak bunun <fieldset> efsanelerinin oluşturulmasıyla uğraştığını fark ettim. Efsanenin burada ortaya çıkmasına ne oluyor ve onu normale nasıl geri dönüyorum? Yani, doğru çizginin tekrar sol çizgiyle dikey olarak hizalanmasını istiyorum. sağa

standart efsane render öncesi Bootstrap, sola, Bootstrap etkilenen render:

Güncelleme: Kırık oluşturmayı neyin neden olduğunu tespit ettik En azından: Bootstrap, efsanenin width özelliğini% 100 ve border-bottom özelliğini '1px solid' olarak değiştirir. Bu, orijinal sınırın, efsanenin sağ tarafına silinmesine ve bunun altındaki bir sınırın görünmesine neden olur. Soru, bunun nasıl çalışması gerektiği. Belki MVC'nin CSS'si (Site.css) Bootstrap'inkilere müdahale ediyor mu?

Answer 1

önyükleme son böylece size stil bildirimleri geçerseniz o sorunu, yani düzeltmek olmalıdır:

<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" /> 
<link href="@Url.Content("~/css/bootstrap.min.css")" rel="stylesheet" type="text/css" /> 

Bootstrap stilleri

fieldset { 
    padding: 0; 
    margin: 0; 
    border: 0; 
} 

legend { 
    display: block; 
    width: 100%; 
    padding: 0; 
    margin-bottom: 27px; 
    font-size: 19.5px; 
    line-height: 36px; 
    color: #333; 
    border: 0; 
    border-bottom: 1px solid #E5E5E5; 
} 

varsayılan MVC style.css stilleri

fieldset { 
    border: 1px solid #DDD; 
    padding: 0 1.4em 1.4em 1.4em; 
    margin: 0 0 1.5em 0; 
} 

legend { 
    font-size: 1.2em; 
    font-weight: bold; 
} 

Diğer taraftan para vs

(son bildirilen MVC varsayılan stilleri)

Alternatif tamamen MVC stil kurtulmak ve ön yükleme alanı kullanmak olsun: 0

Sonuçta gibi görünmelidir İhtiyacınız olan tüm özel stillerle birlikte.