Questions tagged bootstrap-4

Explore the latest questions and answers asked by our top developers.

Adding Image to Bootstrap card-body mobile responsive problem

I have got a bootstrap card with an image on the bottom. My Code also uses AngularJS and ASP.net . When the page gets small enough, the image moves out from the card-body (moves to the left). I want the image to stay in the same place no matter what screen size it’s on. Example: […]

By Norbs
Published
Categorized as angularjs, asp.net, bootstrap-4, css, html Tagged , , , ,

How to change the color of a button on Bootstrap and Angular

Currently the button is en red, when the user enters 2 figures for example, the button must be in blue. How i can create this switch on Bootstrap and Angular? <div class="col-12 col-md-4 text-center" [ngClass]="{‘success’: otp?.length == 2 ? true : false}"> <button class="customButton" (click)="signin()"> ok </button> </div> Thank you in advance Source: Angular Questions

By elodie
Published
Categorized as angular, bootstrap-4 Tagged ,

Not Showing Image in ngx-image-zoom

<ngx-image-zoom [thumbImage]=imageString [fullImage]=imageString [magnification]="1" [enableScrollZoom]="true" [enableLens]="true" [lensWidth]="200"> imageString = "https://localhost:5101/DoImages/dced0609-1d03-4cd8-80ad-4ace5507e26d_fullres.jpg" Im getting image clearly but its not showing in ngx-image-zoom control. already imported required library as "import { NgxImageZoomModule } from ‘ngx-image-zoom’;" in app.module.ts .. and also from component module … but dist showing image ? what wrong with above? could u please suggest me […]

How to apply Boostrap version to one component of Angular application?

I want to add a component in existing angular project which is using bootstrap v4.6.0. But I have developed my new component using bootstrap v5.0.1. Now if I upgrade projects bootstrap version to 5 everything is messing up but if I use existing v4.6 my new component is not working properly. What should I do […]

By Yaditya
Published
Categorized as angular, bootstrap-4, bootstrap-5, css Tagged , , ,

How do i make my navbar toggle to show navbar when clicked in Bootstrap 5

I am using Bootstrap 5 and I created a navbar which I expect it to togggle when collapsed and display the navbar when clicked. When I resize the browser, the toggler icon appears but when I click on it, it doesn’t display my navbar. I have followed every advice given by people on this forum […]

By Vintage Farms
Published
Categorized as angular, bootstrap-4, css, navbar, toggle Tagged , , , ,

How to edit bootstrap navbar?

I am trying to make an angular app, where I am using [email protected] . There in the navbar, I have two links which I want to move it to the right. But I am unable to do it. What do I do? This is the problem HTML code: <nav class="navbar navbar-expand-lg navbar-light bg-light"> <div class="container-fluid"> […]

Angular: some styles/jQuery plugins only load properly on page refresh

I download a HTML template and converted it to Angular project following these steps (https://www.freelancingdesign.com/step-by-step-to-convert-html-template-to-angular-7-template/) When I reload any page everything works fine, but when I navigate between components some plugins (example: owl-carousel) don’t work. angular.json file: "styles": [ "src/assets/css/bootstrap-reboot.min.css", "src/assets/css/bootstrap-grid.min.css", "src/assets/css/owl.carousel.min.css", "src/assets/css/magnific-popup.css", "src/assets/css/select2.min.css", "src/assets/css/paymentfont.min.css", "src/assets/css/slider-radio.css", "src/assets/css/plyr.css", "src/assets/css/main.css", "src/styles.css" ], "scripts": [ "src/assets/js/jquery-3.5.1.min.js", "src/assets/js/bootstrap.bundle.min.js", "src/assets/js/owl.carousel.min.js", […]

After clicking "Add Instruction category" button, another Instruction category should be added within table

On click of "Add Instruction Category" another Instruction Category input field with a row will get add in a table. Code on Stackblitz Details about design: I have created dynamic form which creates multiple tables and rows on user actions. About Issue: Like after clicking on "Add table" button another table getting added and "Add […]

ngBootstrap Angular 8 – Modal Resizable and Draggable

I am trying to use the bootstrap https://ng-bootstrap.github.io/#/components/modal/examples version 4 with Angular 8. I want to make modal re-sizable and draggable. I see a few examples for other versions like 3.xx but not with angular – http://jsfiddle.net/GDVdN/ Any references for Bootstrap4 with ANgular 8 – Modal resizable + draggable?. Source: Angular Questions

How to disable Click even on sidebar menu in Angular

I have a sidebar in angular. I want to disable click even on sidebar menu items so that people are not able to navigate. I want them to go through a flow. However disable [routerLink] mess up the css. Any tips or tricks how to solve the issue. HTML Code for Sidebar Navigation <ul class="nav"> […]

By Saad Ahmed
Published
Categorized as angular, bootstrap-4, css, html, javascript Tagged , , , ,
1 2 3 47

Still Have Questions?


Our dedicated development team is here for you!

We can help you find answers to your question for as low as 5$.

Contact Us
faq