Search code examples
htmlcssjqbootstrapvalidationbootstrapvalidator

Bootstrap validation symbol(correct and wrong symbol) font is missing


I am doing bootstrap validation using bootstrap.min.css for my website.I have done the validation,but font missing creates hurdle for me.I have added a screenshorts .Please suggest me why font is missing?

enter image description here

code in bootstrap.min.css

.glyphicon-ok:before {
    content: "\e013"
}
.glyphicon-remove:before {
    content: "\e014"
}

It is coming in firebug ,please check it. I have tried a lot,but unable to fix it. Thank you in advance. Any suggestion will highly appreciate.


Solution

  • There are lots of unknown in your question,

    What version of bootstrapvalidator and bootstrap you are using?

    Did you included feedback icons in JS?

    feedbackIcons: {
        valid: 'glyphicon glyphicon-ok',
        invalid: 'glyphicon glyphicon-remove',
        validating: 'glyphicon glyphicon-refresh'
    },
    

    Are you loading the bootstrap.css or bootstrap.min.css from local server?

    Are all font files exist and have correct names?

    Is fonts folder path is correct?

    Possible solution.

    Mostly, This happens if font files missing or not loading correctly, folder name is wrong or font files path is wrong

    @font-face {
      font-family: 'Glyphicons Halflings';
      src: url('../fonts/glyphicons-halflings-regular.eot');
      src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
    }
    

    load bootstrap.css from CDN Server,

    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css"/>
    

    if font icons shown, then in local bootstrap.css file check the font paths and folder name is correct and font files does exist and file names are correct.

    To get the correct fonts, go to the Bootstrap homepage and download the full .zip file. Extract the four font files from there to your fonts directory and everything should work.