glyphicons

Bootstrap Glyphicons not displaying in angular2

by

Boostrap 4 does not support Glyphicons anymore, you can use Font Awesome instead: npm install –save fortawesome/fontawesome-free and add the css File to your .angular-cli.json “apps”: [ { …. “styles”: [ “styles.css”, “../node_modules/bootstrap/dist/css/bootstrap.css”, “../node_modules/font-awesome/css/font-awesome.css” ], … } ] ], Replace CSS class with the Font Awesome classes: <i class=”navbar-toggler-icon fa fa-bars”> </i> recompile app: ng … Read more

Bootstrap 3 Tooltip over Glyphicon

by

You can get a simple tooltip over the glyphicon using the title attribute (which is blank in your example). title=”info” Working code // add this in your js // all the glyphicons having the class “my-tooltip” will show a tooltip if “title” attribute is present $(“.my-tooltip”).tooltip(); <span class=”glyphicon glyphicon-info-sign my-tooltip” title=”here goes the tooltip text”></span>

Twitter bootstrap glyphicons do not appear in release mode 404

by

Here’s how I solved it — I’m using MVC5 and Bootstrap 3.1.1. I have my files organized in the project like this: /Content/Bootstrap/bootstrap.css bootstrap.min.css /Content/fonts/glyphicons-halflings-regular.eot glyphicons-halflings-regular.svg glyphicons-halflings-regular.ttf glyphicons-halflings-regular.woff Then I added another level to my virtual path in the bundle config bundles.Add(new StyleBundle(“~/Content/site/css”).Include( “~/Content/bootstrap/bootstrap.css”, “~/Content/styles/site.css” )); Previously I had used ~/Content/css And in the view… … Read more

Twitter bootstrap 3.0 icon change on collapse

by

The collapse events are handled differently in Bootstrap 3. Now it would be something like: $(‘#collapseDiv’).on(‘shown.bs.collapse’, function () { $(“.glyphicon”).removeClass(“glyphicon-folder-close”).addClass(“glyphicon-folder-open”); }); $(‘#collapseDiv’).on(‘hidden.bs.collapse’, function () { $(“.glyphicon”).removeClass(“glyphicon-folder-open”).addClass(“glyphicon-folder-close”); }); Demo: http://www.bootply.com/73101

Center Twitter Bootstrap 3 Glyphicons in buttons

by

Move the text out of the <span> with the glyphicon and apply vertical-align: middle; to the <span> <button class=”btn btn-default”> <span class=”glyphicon glyphicon-th” style=”vertical-align: middle;”></span> Centered </button> Demo This works in Bootstrap 4 with Font Awesome icons like so <button class=”btn btn-default” style=”vertical-align: middle;”> <i class=”fa fa-times”></i> Centered </button>

Using a Glyphicon as an LI bullet point (Bootstrap 3)

by

This isn’t too difficult with a little CSS, and is much better than using an image for the bullet since you can scale it and colour it and it will keep sharp at all resolutions. Find the character code of the glyphicon by opening the Bootstrap docs and inspecting the character you want to use. … Read more

How to add glyphicons to rails link_to helper – Bootstrap 3

by

I found the answer to this here The basic form of a glyph link in rails looks like this: <%= link_to deals_path, class: “btn btn-default” do %> <i class=”glyphicon glyphicon-euro”></i> Dashboard <% end %> Modify as needed. The second example in that link didn’t work for me, I assume because I’m using the rails_bootstrap_sass gem? … Read more

How to flip the glyphicon icon

by

Like this HTML <a href=”#” class=”btn”><i class=”icon-rotate icon-flipped”></i></a> CSS .icon-flipped { transform: scaleX(-1); -moz-transform: scaleX(-1); -webkit-transform: scaleX(-1); -ms-transform: scaleX(-1); } OR http://fortawesome.github.io/Font-Awesome/examples/#rotated-flipped

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)