Newest 'twitter-bootstrap' Questions

Q&A for professional and enthusiast programmers

Html button over an image

How can have a button or link like the following which stays on top an image? See the red ovals in the image below. I have got this image from carousel and tweaked the style a bit like this. <...

Bootstrap 4 - Responsive horizontal navs

I'm running into a problem with Bootstrap 4 navs where nav links overhang if their container is too small in width. This is very often the case for mobile devices. Here is an example: http://codepen....

How to add bootstrap datetimepicker in Symfony form

I'm trying to use http://eonasdan.github.io/bootstrap-datetimepicker/ in my Symfony form. I added: <link type="text/css" rel="stylesheet" href="{{ asset('assets/css/bootstrap-datetimepicker-...

How can apply custom css style to a table that comes from backend code

I have used a table (in bootstrap) that look like: in "Static" page table it is working fine with td bgcolor etc. But in "Dynamic" page table its coming from "Text editor", so that the table design ...

Why does mvc have the site.css file before the bootstrap file?

I've been trying to figure out how to modify the css of my mvc app (that is bootstrapped) and there seem to be quite a few posts on using @Render and @Section to deal with the problem. But then I ...

How to set height of a bootstrap's row?

I have such a HTML: <div class="row"> <div class="col-xs-12"> <form> <div class="form-group"> <label for="vipResult">Result</label> ...

html table rows height issue

Okay so I made that table which I want it too look like a gradebook but I cant edit the row heights. In the picture below I drew a line around the rows I want their size to be decrease so they can ...

How to use callback function for bootstrapValidator plugin

I am using BootstrapValidor.js plugin. I am initializing this way if ($('#main_create_form').length > 0 && $.fn.bootstrapValidator) { $('#main_create_form').BootstrapValidator({ ...

Bootstrap tab nav not working when redirect from another page

I am using bootstrap tab for profile update and other things. It is good but when we redirect from like home to specific bootstrap tab then it is not working. <ul class="menu"> <li&...

Change class attribute depending on value in local storage

I have js in my header that checks local storage and sets the stylesheet accordingly. I am using a Bootstrap navbar and I want the navbar to change to inverse colour depending on the local storage ...

Bootstrap's contextual colors

Why and when do web developers use Bootstrap's contextual colors? What's the point of primary, success, info, warning, danger classes if they already have colors assigned to them?

number of results per row in a while loop [on hold]

I know the description in the title may be somehow unclear, but I can't find a better way to describe my problem. I echo out the results of a query in a book database table. I display a cover picture,...

Issue with form in bootstrap 3 modal

Something weird is happening with my form which is in a modal. Here is my mark-up <div class="modal fade" id="invoice-modal"> <div class="modal-dialog"> <div class="modal-content"...

Aligning multiple items left-top and center using flexbox

In my header I have 2 menu-blocks which I want to place on top of an image (using flexbox and absolute positioning. The first menu-block has to be in the top-left corner (on top of the image). The ...

Overview of items in Bootstrap with asp.net mvc Razor

I'm using bootstrap and showing a grid of items. I show 6 items a row. Currently I'm having this code below, the code works but the smell of code is bad. @{ int rowcnt = 0; } @for (int i = 0; i < ...

Remove space between textboxes and buttons

My code is as follows: I want to remove the spaces between the textboxes and button, so all 3 elements are stuck to one another. How can I get this done. <div class="container"> <div ...

Bootstrap Button CSS changes not working for :active selector

I am using a bootstrap 3.3.7 button, and want the button to stay the same color when a mouse focuses, hovers, or clicks on it. <button class="btn btn-default delete-btn">Delete</button> ...

Bootstrap 3 form columns not collapsing

I am trying to get some columns to collapse: <div class="container sign-up-form-container"> <form> <div class="row"> <input type="text" name="...

Bootstrap Navbar Missing on Heroku Deploy (NodeJS, Angular2)

Before this is flagged as a duplicate question, this question offers a ruby specific answer using rake which is not applicable in my situation. Why is my bootstrap nav bar missing only in production ...

Bootstrap Navigation | Desktop: Show submenu only on hover / Mobile: show submenu

I am trying now for hours and I couldn't find a good stable way. I have a bootstrap menu with dropdown (submenu 1 level). The submenu is shown on hover the top level menu. Now, the problem is, that I ...

Border around CSS background image

I want to draw a border around a CSS background image, which resizes itself according to window size in a container div. I can draw a border around the div, but not around the image itself. Can this ...

Toggle bootstrap modal after Ajax contact load

I’m using bootstrap toggle to load a modal with remote content <button data-toggle="modal" href="content.php?id=<?php echo strip_tags($results['id']);?>" data-target="#myModal">Click me&...

Personalize the Bootstrap theme? [on hold]

I created a basket on bootstrap using "Font Awesome". 1) How to write the badge in red ? 2) How to put the badge on the cart ? <a href="/cart"> <i class="fa fa-shopping-cart fa-3x"></...

bootstrap input group btn pushed down after jquery validation kicks in

I have a bootstrap styled form: <div class="form-group"> <label for="formEmail">User Email</label> <div class="input-group"> <select ...

Symfony choice type select value on edit page

In symfony form builder I added a choice type field. When I create a form everything is ok but when I go to the edit page, the choice from the field is not preselected. How can I select the value that ...

resizing the image to fit the parent CSS/Bootstrap

I have a html and a CSS file where I set the background of the body tag to background-image: url(..); HTML <!DOCTYPE html> <html lang="en"> <head> <!-- Required meta tags --&...

Setting background-image for bootstrap's container from .css file

I have a problem with setting background image for bootstrap's container from .css file. Let's say.. HTML: <!DOCTYPE html> <html> <head> <title>Background</title> <...

How to test bootstrap methods in node?

I have a react component that has the following line in componentDidMount(): $('[data-toggle="tooltip"]').tooltip(); When I run my test, I get: TypeError: $(...).tooltip is not a function I have ...

How do I prevent jquery from crashing on fast transition in bootstrap 4 accordion?

Here is my code: https://jsfiddle.net/aaz15/dLnrsfty/ What I am basically trying to achieve (with success) is to deviate from the official bootstrap documentation (http://v4-alpha.getbootstrap.com/...

how to overlap one div on another?

I have 3 panels(top, lower 1 and lower 2). What i want to achieve is, top panel should be above lower 1 and lower 1 should be above lower 2. I am new to css and bootstrap and what i understood is the ...

How to change button in twitter bootstrap using jquery

I have a button: <button class="btn btn-animated btn-default ban-user-btn" id="btn-ban-username" // the username is generated by twig data-nick="username" // the username is generated ...

How to enable intellisense for bootstrap installed as npm package?

I have an Angular 2 project based on webpack 2. Bootstrap is installed as npm package and imported in the app, but Visual Studio doesn't give me intellisense when I edit html files by default. I ...

adjust main container width according to table width

Is it possible ..if table width increase then its main container widths increase according to that. Is it possible ?? <div class="container main-con"> <table class="table table-hover"&...

React bootstrap modal es6

Hello i need help displaying a bootstrap modal import React from 'react'; import styles from '../App.css'; import styles from '../../../public/css/app.css'; import Button from 'react-bootstrap/lib/...

bootstrap - make input stretch when hiding sidebar

How to make the text input stretch as well when hiding sidebar? Look at example on jsFIDDLE html: <div class="container-fluid"> <div class="row"> <div class="col-sm-10"> ...

How to move divs when you have a smaller screen

I am having a difficult time using push and pull to move my divs for smaller screens. Divs on larger screen: [A] [B] [C] How I would like for them to look on smaller screens: [A] [B] [ C ] Any ...

Dynamic CSS color gradients based on number selected items

I am trying set the background color of div boxes in increasing gradients based on the specific CSS items found/discovered on the page. (I looked here and here but they did not address the calculation ...

Bootstrap theme classes

Into my website a have a simple theme bootstrap and I want to apply a new theme! The new theme's developer did not use the CSS class "box" (used into first theme) but he redefines a new class "panel"...

Bootstrap table fixed header colspan not working

I have a bootstrap table which has fixed header. It is working fine. When I add colspan in table. Table gets collapsed. Is there any other possibility to achieve both fixed header and table colspan ...

Can't get an image in a tooltip

I am currently creating a website for a school project, and I am pretty new to html. I am trying to have an image and a short text pop up over a highlighted word to explain it in detail with a picture....

I cannot get bootstrap working properly with SCSS refills

I'm not entirely sure what is going on. This is the first time I've had this much difficulty with anything web really. If I add rows above paralax, the "Kyle's Work" in main is off center. That ...

Webpack bundle - Bootstrap's JavaScript requires jQuery

I am trying to achieve the following: bundle (in this order) jquery, tether, and bootstrap.js. load this bundle within a HTMLpage and beneath it load other page specific scripts. To achieve this I ...

how code for exam mark list entry and View it in php mysqli

I have Following DB Tables. Student_info Exam_info Class_info subject_info How I Add Marks Details In Mark_list Table ? And How I Retrieve for future views/edits. I Uses Bootstrap,php ,MYSQLi for ...

Auto lookup feature using bootstrap (Plunker Attached)

here is the plunker- http://plnkr.co/edit/nMozzczMrbXJPfcps0A2?p=preview If you can notice, i have added the below css class to auto lookup feature. .dropdown-menu { background-color:white; ...

data-hover menu doesn't open for some Chrome users

I have drop-down menus with data-hover="dropdown". I've been getting reports from a few users that the drop-down menus don't appear for them. The most cooperative user says it happens in Chrome 55.0....

Bootstrap collapse displaying beside not below

I'm using bootstrap collapse to show/hide a list. However, the list is starting beside the collapse button and not below. See the image: The HTML code is the following: <nav class="mobile-menu"&...

how to limit time to be selected on bootstrap time picker [duplicate]

I want to be able to limit the time in the time picker. For example the user can only choose time from 9am to 10pm. Meaning 11-8pm cannot be selected. Or when 11 pm is chosen it will be invalid.

Prevent Twitter bootstrap modal from closing on click release outside the window

I am utilizing twitter bootstrap modals in my application and have a few sliders inside them that occasionally my users will drag all the way to one side and release outside the modal window. Of ...

Bootstrap - Content Small on Phone

I am making a website for a project. I am having some issues making it "compatible" with any kind of phone, in the sense that everything that is on the website is extremely small, and some of the ...

responsive group of images

I've been trying to make a group of images-list page using bootstrap but I can't make it responsive on other resolutions, The images moves left and the entire style of the arrangement will break. <...
Translating... 0%