Weird Error on Bootstrap

Strange error when using CSS boostrap

I just add the wrong link, here is the good one, notice its got the min.css:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

Bootstrap css errors in the console

Bootstrap has added vendor prefixes in css for cross browser support. Here -webkit- is for webkit engine (chrome, safari) and -o- is for opera.
the -webkit-gradient rule is a bit old and was later replaced by -webkit-linear-gradient.
The errors are there because, firefox does not recognize the webkit or opera prefixes. The errors can be ignored and they are to implement css3 experimental features maintaining cross browser issues.

weird error in bootstrapValidator in jsp with Bootstrap

There is nothing much wrong with the code, only problem is here $('#login') you are targeting the modal id,

var validator = $('#login').bootstrapValidator({ //validation code });

you have to target the form selector Read How to call the plugin

so assign an id to form e.g id="loginForm" different then modal id.

<form action="logindone.jsp" id="loginForm" method="post" class="form-horizontal" role="form">

and bootstrapValidator code will be

var validator = $('#loginForm').bootstrapValidator({ //validation code });

Rest is all good

Working Fiddle Example

Weird bootstrap grid fail?

If all the images are the same size, there is no issue:

https://jsbin.com/muzug/1/

https://jsbin.com/muzug/1/edit?html,css,output

Also, not necessary to have the col-xs-12, it will always be 100% under the last min-width class used.

Added a rounding error correction.

CSS:

.row.no-pad img {width:100.1%;}
.row.no-pad [class*="col-"] {padding:0;margin-bottom:-1px}

HTML

 <section class="container-fluid">
    
    
       <div class="row no-pad">
         
           <div class="col-md-6 col-lg-4"> 
              <img src="https://scontent-a-lhr.xx.fbcdn.net/hphotos-xap1/t31.0-8/1617132_1517052665201751_3430332756563801835_o.jpg">
           </div>
    
           <div class="col-md-6 col-lg-4"> 
              <img src="https://scontent-a-lhr.xx.fbcdn.net/hphotos-xap1/t31.0-8/1617132_1517052665201751_3430332756563801835_o.jpg">
           </div>
         
                <div class="col-md-6 col-lg-4"> 
              <img src="https://scontent-a-lhr.xx.fbcdn.net/hphotos-xap1/t31.0-8/1617132_1517052665201751_3430332756563801835_o.jpg">
           </div>
    
           <div class="col-md-6 col-lg-4"> 
              <img src="https://scontent-a-lhr.xx.fbcdn.net/hphotos-xap1/t31.0-8/1617132_1517052665201751_3430332756563801835_o.jpg">
           </div>
    
           <div class="col-md-6 col-lg-4"> 
              <img src="https://scontent-a-lhr.xx.fbcdn.net/hphotos-xap1/t31.0-8/1617132_1517052665201751_3430332756563801835_o.jpg">
           </div>
         
           <div class="col-md-6 col-lg-4"> 
              <img src="https://scontent-a-lhr.xx.fbcdn.net/hphotos-xap1/t31.0-8/1617132_1517052665201751_3430332756563801835_o.jpg">
           </div>
    
      </div>
   </div>

Bootstrap 3.3.6 warnings and errors in bootstrap.min.css

See this thread:

Weird Error on bootstrap

Apparently it's a Firefox issue, the errors don't appear in Chrome.

---

Related Topics