Bootstrap has a wide range of responsive margin and padding utility classes. They work for all breakpoints: xs (<=576px), sm (>=576px), md (>=768px), lg (>=992px) or xl (>=1200px)) The classes are used in the format: {property}{sides}-{size} for xs & {property}{sides}-{breakpoint}-{size} for sm, md, lg, and xl. m – sets margin p – sets padding t … Read more
Increase width with CSS You can use CSS to increase the width of your popover, like so: /* The max width is dependant on the container (more info below) */ .popover{ max-width: 100%; /* Max Width of the popover (depending on the container!) */ } If this doesn’t work, you probably want the solution below … Read more
In case anyone else stumbles across this question, this is probably what you were looking for: .grabbable { cursor: move; /* fallback if grab cursor is unsupported */ cursor: grab; cursor: -moz-grab; cursor: -webkit-grab; } /* (Optional) Apply a “closed-hand” cursor during drag operation. */ .grabbable:active { cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing; }
Text nodes cannot have margins or any other style applied to them, so anything you need style applied to must be in an element. If you want some of the text inside of your element to be styled differently, wrap it in a span or div, for example.
Another option is, instead of floating, to set the white-space property nowrap to a parent div: .parent { white-space: nowrap; } and reset the white-space and use an inline-block display so the divs stay on the same line but you can still give it a width. .child { display:inline-block; width:300px; white-space: normal; } Here is … Read more
When you specify a percentage for max-height on a child, it is a percentage of the parent’s actual height, not the parent’s max-height, oddly enough. The same applies to max-width. So, when you don’t specify an explicit height on the parent, then there’s no base height for the child’s max-height to be calculated from, so … Read more
\9 is a “CSS hack” specific to Internet Explorer 7, 8, & 9. This simply means that the one specific line of CSS ending with a \9; in place of the ; is only valid in IE 7, 8, & 9. In your example, width: 500px\9; means that a width of 500 pixels (same result … Read more
To enable background printing in Chrome: body { -webkit-print-color-adjust: exact !important; } Edit: For Chrome, Safari and Firefox: body{ -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; }
Bootstrap Version 3.x As always, read Bootstrap’s great documentation: 3.x Docs: https://getbootstrap.com/docs/3.3/css/#grid-nesting Make sure the parent level row is inside of a .container element. Whenever you’d like to nest rows, just open up a new .row inside of your column. Here’s a simple layout to work from: <div class=”container”> <div class=”row”> <div class=”col-xs-6″> <div class=”big-box”>image</div> … Read more
You can chain class selectors without a space between them: .a.b { color: #666; } Note that, if it matters to you, IE6 treats .a.b as .b, so in that browser both div.a.b and div.b will have gray text. See this answer for a comparison between proper browsers and IE6.