बटन

Question

में माउस होवर पर समस्या मैं ट्विटर बूटस्ट्रैप का उपयोग कर रहा हूं और btn-primary बटन पर होवर करते समय मुझे कुछ अजीब लग रहा है।

यह मेरा कोड है:

<div class="navbar navbar-fixed-top"> 
    <div class="navbar-inner"> 
    <div class="container"> 
     <ul class="nav nav-pills"> 
     <li class="active"> 
     <a href="#">Home</a> 
     </li> 
     <li><a href="#">...</a></li> 
     <li><a href="#">...</a></li> 
     <li><a href="#" class="btn btn-primary btn-small"> 
        <i class="icon-user icon-white"></i> Log In 
        </a> 
       </li> 
    </ul> 
    </div> 
    </div> 
</div> 

और यह क्या होता है:

से पहले

हॉवर पर

---

कोई भी विचार क्यों यह हो रहा हो सकता?

Answer 1

2 समाधान,

• आसान: ली से एक href निकालें। प्रो: तेज़, कोई रखरखाव नहीं। Con: यदि आपको ड्रॉपडाउन की आवश्यकता है तो यह नहीं कर सकता, डिज़ाइन तोड़ सकता है।
• पसंदीदा: ली के भीतर बीटीएन का समर्थन करने के लिए गायब सीएसएस कक्षाएं जोड़ें।

.navbar .nav > li > a.btn { 
display: inline-block; padding: 4px 10px 4px; margin: 5px 5px 6px; line-height: 18px; 
} 

.navbar .nav > li > a.btn-primary, 
.navbar .nav > li > a.btn-primary:hover { 
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); 
    color: #ffffff; 
} 


.navbar .nav > li > a.btn-primary:active { 
    color: rgba(255, 255, 255, 0.75); 
} 

.navbar .nav > li > a..btn-primary { 
    background-color: #0074cc; 
    background-image: -moz-linear-gradient(top, #0088cc, #0055cc); 
    background-image: -ms-linear-gradient(top, #0088cc, #0055cc); 
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0055cc)); 
    background-image: -webkit-linear-gradient(top, #0088cc, #0055cc); 
    background-image: -o-linear-gradient(top, #0088cc, #0055cc); 
    background-image: linear-gradient(top, #0088cc, #0055cc); 
    background-repeat: repeat-x; 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc',endColorstr='#0055cc', GradientType=0); 
    border-color: #0055cC#0055cC#003580; 
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); 
    filter: progid:dximagetransform.microsoft.gradient(enabled=false); 
} 
.navbar .nav > li > a.btn-primary:hover, 
.navbar .nav > li > a.btn-primary:active, 
.navbar .nav > li > a.btn-primary.disabled, 
.navbar .nav > li > a.btn-primary[disabled] { 
    background-color: #0055cc; 
} 
.navbar .nav > li > a.btn-primary:active, 
.navbar .nav > li > a.btn-primary.active { 
    background-color: #004099 \9; 
}