1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
|
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://gmpg.org/xfn/11" rel="profile">
<link rel="canonical" href="https://blog.getbootstrap.com/">
<meta name="description" content="Official blog for the Bootstrap framework.">
<meta name="generator" content="Hugo 0.105.0">
<title>Bootstrap Blog · Official blog for the Bootstrap framework.</title>
<link href="/assets/css/style.css" rel="stylesheet">
<link rel="alternate" type="application/rss+xml" href="https://blog.getbootstrap.com/feed.xml" title="Bootstrap Blog">
<!-- Favicons -->
<link rel="apple-touch-icon" href="/assets/img/favicons/apple-touch-icon.png" sizes="180x180">
<link rel="icon" href="/assets/img/favicons/favicon-32x32.png" sizes="32x32" type="image/png">
<link rel="icon" href="/assets/img/favicons/favicon-16x16.png" sizes="16x16" type="image/png">
<link rel="manifest" href="/assets/img/favicons/manifest.json">
<link rel="mask-icon" href="/assets/img/favicons/safari-pinned-tab.svg" color="#712cf9">
<link rel="icon" href="/assets/img/favicons/favicon.ico">
<meta name="theme-color" content="#712cf9">
<meta name="author" content="Mark Otto">
<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image"/>
<meta name="twitter:image" content="https://blog.getbootstrap.com/assets/img/bootstrap-social.png"/>
<meta name="twitter:title" content="Bootstrap Blog"/>
<meta name="twitter:description" content="Official blog for the Bootstrap framework."/>
<meta name="twitter:creator" content="@">
<!-- Facebook -->
<meta property="og:title" content="Bootstrap Blog" />
<meta property="og:description" content="Official blog for the Bootstrap framework." />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://blog.getbootstrap.com/" /><meta property="og:image" content="https://blog.getbootstrap.com/assets/img/bootstrap-social.png"/>
<meta property="og:image:width" content="2000">
<meta property="og:image:height" content="1000">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-12', 'getbootstrap.com');
ga('set', 'anonymizeIp', true);
ga('send', 'pageview');
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
<script>
(function(html) {
html.className = html.className.replace(/\bno-js\b/, '');
})(document.documentElement);
</script>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
<symbol id="archive" viewBox="0 0 16 16">
<path d="M0 2a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1v7.5a2.5 2.5 0 0 1-2.5 2.5h-9A2.5 2.5 0 0 1 1 12.5V5a1 1 0 0 1-1-1V2zm2 3v7.5A1.5 1.5 0 0 0 3.5 14h9a1.5 1.5 0 0 0 1.5-1.5V5H2zm13-3H1v2h14V2zM5 7.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z"/>
</symbol>
<symbol id="file-earmark-richtext" viewBox="0 0 16 16">
<path d="M14 4.5V14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h5.5L14 4.5zm-3 0A1.5 1.5 0 0 1 9.5 3V1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V4.5h-2z"/>
<path d="M4.5 12.5A.5.5 0 0 1 5 12h3a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm0-2A.5.5 0 0 1 5 10h6a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm1.639-3.708 1.33.886 1.854-1.855a.25.25 0 0 1 .289-.047l1.888.974V8.5a.5.5 0 0 1-.5.5H5a.5.5 0 0 1-.5-.5V8s1.54-1.274 1.639-1.208zM6.25 6a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5z"/>
</symbol>
<symbol id="film" viewBox="0 0 16 16">
<path d="M0 1a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H1a1 1 0 0 1-1-1V1zm4 0v6h8V1H4zm8 8H4v6h8V9zM1 1v2h2V1H1zm2 3H1v2h2V4zM1 7v2h2V7H1zm2 3H1v2h2v-2zm-2 3v2h2v-2H1zM15 1h-2v2h2V1zm-2 3v2h2V4h-2zm2 3h-2v2h2V7zm-2 3v2h2v-2h-2zm2 3h-2v2h2v-2z"/>
</symbol>
<symbol id="rss" viewBox="0 0 16 16">
<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>
<path d="M5.5 12a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm-3-8.5a1 1 0 0 1 1-1c5.523 0 10 4.477 10 10a1 1 0 1 1-2 0 8 8 0 0 0-8-8 1 1 0 0 1-1-1zm0 4a1 1 0 0 1 1-1 6 6 0 0 1 6 6 1 1 0 1 1-2 0 4 4 0 0 0-4-4 1 1 0 0 1-1-1z"/>
</symbol>
<symbol id="three-dots" viewBox="0 0 16 16">
<path d="M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"/>
</symbol>
</svg>
<header class="navbar navbar-expand-lg navbar-dark bd-navbar sticky-top">
<nav class="container-xxl bd-gutter flex-wrap flex-lg-nowrap" aria-label="Main navigation">
<div class="d-lg-none" style="width: 2.25rem;"></div>
<a class="navbar-brand p-0 me-0 me-lg-2" href="/" aria-label="Bootstrap">
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="32" class="d-block my-1" viewBox="0 0 118 94" role="img"><path fill-rule="evenodd" clip-rule="evenodd" d="M24.509 0c-6.733 0-11.715 5.893-11.492 12.284.214 6.14-.064 14.092-2.066 20.577C8.943 39.365 5.547 43.485 0 44.014v5.972c5.547.529 8.943 4.649 10.951 11.153 2.002 6.485 2.28 14.437 2.066 20.577C12.794 88.106 17.776 94 24.51 94H93.5c6.733 0 11.714-5.893 11.491-12.284-.214-6.14.064-14.092 2.066-20.577 2.009-6.504 5.396-10.624 10.943-11.153v-5.972c-5.547-.529-8.934-4.649-10.943-11.153-2.002-6.484-2.28-14.437-2.066-20.577C105.214 5.894 100.233 0 93.5 0H24.508zM80 57.863C80 66.663 73.436 72 62.543 72H44a2 2 0 01-2-2V24a2 2 0 012-2h18.437c9.083 0 15.044 4.92 15.044 12.474 0 5.302-4.01 10.049-9.119 10.88v.277C75.317 46.394 80 51.21 80 57.863zM60.521 28.34H49.948v14.934h8.905c6.884 0 10.68-2.772 10.68-7.727 0-4.643-3.264-7.207-9.012-7.207zM49.948 49.2v16.458H60.91c7.167 0 10.964-2.876 10.964-8.281 0-5.406-3.903-8.178-11.425-8.178H49.948z" fill="currentColor"/></svg>
</a>
<button class="navbar-toggler d-flex d-lg-none order-3 p-2" type="button" data-bs-toggle="offcanvas" data-bs-target="#bdNavbar" aria-controls="bdNavbar" aria-expanded="false" aria-label="Toggle navigation">
<svg class="bi" width="24" height="24" aria-hidden="true"><use xlink:href="#three-dots"></use></svg>
</button>
<div class="offcanvas-lg offcanvas-end flex-grow-1" id="bdNavbar" aria-labelledby="bdNavbarOffcanvasLabel">
<div class="offcanvas-header px-4 pb-0">
<h5 class="offcanvas-title text-white" id="bdNavbarOffcanvasLabel">Bootstrap</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas" aria-label="Close" data-bs-target="#bdNavbar"></button>
</div>
<div class="offcanvas-body p-4 pt-0 p-lg-0">
<hr class="d-lg-none text-white-50">
<ul class="navbar-nav flex-row flex-wrap bd-navbar-nav">
<li class="nav-item col-6 col-lg-auto">
<a class="nav-link py-2 px-0 px-lg-2" href="https://getbootstrap.com/docs/5.2/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Docs</a>
</li>
<li class="nav-item col-6 col-lg-auto">
<a class="nav-link py-2 px-0 px-lg-2" href="https://getbootstrap.com/docs/5.2/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
</li>
<li class="nav-item col-6 col-lg-auto">
<a class="nav-link py-2 px-0 px-lg-2" href="https://icons.getbootstrap.com/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Icons');" target="_blank" rel="noopener">Icons</a>
</li>
<li class="nav-item col-6 col-lg-auto">
<a class="nav-link py-2 px-0 px-lg-2" href="https://themes.getbootstrap.com/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Themes');" target="_blank" rel="noopener">Themes</a>
</li>
<li class="nav-item col-6 col-lg-auto">
<a class="nav-link py-2 px-0 px-lg-2 active" href="https://blog.getbootstrap.com/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Blog');" rel="noopener">Blog</a>
</li>
</ul>
<hr class="d-lg-none text-white-50">
<ul class="navbar-nav flex-row flex-wrap ms-md-auto">
<li class="nav-item col-6 col-lg-auto">
<a class="nav-link py-2 px-0 px-lg-2" href="https://github.com/twbs" target="_blank" rel="noopener">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" class="navbar-nav-svg" viewBox="0 0 512 499.36" role="img"><path fill="currentColor" fill-rule="evenodd" d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z"/></svg>
<small class="d-lg-none ms-2">GitHub</small>
</a>
</li>
<li class="nav-item col-6 col-lg-auto">
<a class="nav-link py-2 px-0 px-lg-2" href="https://twitter.com/getbootstrap" target="_blank" rel="noopener">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" class="navbar-nav-svg" viewBox="0 0 512 416.32" role="img"><path fill="currentColor" d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92"/></svg>
<small class="d-lg-none ms-2">Twitter</small>
</a>
</li>
<li class="nav-item col-6 col-lg-auto">
<a class="nav-link py-2 px-0 px-lg-2" href="https://opencollective.com/bootstrap" target="_blank" rel="noopener">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" class="navbar-nav-svg" fill="currentColor" fill-rule="evenodd" viewBox="0 0 40 41" role="img"><title>Open Collective</title><path fill-opacity=".4" d="M32.8 21c0 2.4-.8 4.9-2 6.9l5.1 5.1c2.5-3.4 4.1-7.6 4.1-12 0-4.6-1.6-8.8-4-12.2L30.7 14c1.2 2 2 4.3 2 7z"/><path d="M20 33.7a12.8 12.8 0 0 1 0-25.6c2.6 0 5 .7 7 2.1L32 5a20 20 0 1 0 .1 31.9l-5-5.2a13 13 0 0 1-7 2z"/></svg>
<small class="d-lg-none ms-2">Open Collective</small>
</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<div class="container-xxl px-4 px-xxl-2">
<div class="d-lg-grid" id="content">
<div class="sidebar">
<div class="masthead py-5">
<div class="mb-4 text-center text-lg-start">
<a class="flex-shrink-0 mb-lg-3 link-dark text-decoration-none" href="/" aria-label="Bootstrap">
<img src="/assets/brand/bootstrap-logo-shadow.png" width="200" height="165" alt="Bootstrap" class="bd-booticon d-block mx-auto mb-3 mx-lg-0">
</a>
<div class="ms-3 ms-lg-0">
<h1 class="mb-1 mb-lg-2 f1 fw-600">The Bootstrap Blog</h1>
<p class="col-sm-8 col-lg-12 mx-auto mb-0 mb-lg-4">
News and announcements for all things <a href="https://getbootstrap.com/" title="Visit the Bootstrap docs">Bootstrap</a>,
including new releases, <a href="https://themes.getbootstrap.com/" title="Browse the official Bootstrap themes">Bootstrap Themes</a>,
and <a href="https://icons.getbootstrap.com/" title="Official open source Bootstrap Icons">Bootstrap Icons</a>.
</p>
</div>
</div>
<nav class="nav nav-pills justify-content-center flex-lg-column justify-content-lg-start gap-1 sidebar-nav">
<a class="nav-link d-flex align-items-center active fw-600" href="/">
<svg class="bi me-2 f5 bd-text-purple"><use xlink:href="#file-earmark-richtext"></use></svg>
All posts
</a>
<a class="nav-link d-flex align-items-center text-dark" href="/archive/">
<svg class="bi me-2 f5 text-primary"><use xlink:href="#archive"></use></svg>
Archive
</a>
<a class="nav-link d-flex align-items-center text-dark" href="/videos/">
<svg class="bi me-2 f5 text-info"><use xlink:href="#film"></use></svg>
Videos
</a>
<a class="nav-link d-flex align-items-center text-dark" href="https://blog.getbootstrap.com/feed.xml">
<svg class="bi me-2 f5 text-warning"><use xlink:href="#rss"></use></svg>
Subscribe
</a>
</nav>
<script async src="https://cdn.carbonads.com/carbon.js?serve=CKYIKKJJ&placement=bloggetbootstrapcom" id="_carbonads_js"></script>
</div>
</div>
<div class="main">
<div class="posts-container mx-auto my-5">
<div class="posts">
<div class="post">
<h1 class="post-title fw-600">
<a href="/2019/11/26/bootstrap-4-4-0/" class="text-decoration-none">
Bootstrap 4.4.0
</a>
</h1>
<div class="d-flex align-items-center mb-4 text-muted author-info">
<a class="d-flex align-items-center text-muted text-decoration-none" href="https://github.com/mdo" target="_blank" rel="noopener">
<img class="mb-0 me-2 rounded-2" srcset="https://github.com/mdo.png?size=32, https://github.com/mdo.png?size=64 2x"
src="https://github.com/mdo.png?size=32"
alt="" width="32" height="32">
<span>@mdo</span>
</a>
<span class="d-flex align-items-center ms-3" title="26 Nov 19 00:00 UTC">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" class="me-2" viewBox="0 0 16 16" role="img" fill="currentColor">
<path d="M11 6.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1z"/>
<path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z"/>
</svg>
November 26, 2019
</span>
</div>
<div class="ratio ratio-16x9">
<iframe src="https://www.youtube-nocookie.com/embed/P5ZJui3aPoQ?rel=0" title="YouTube Video" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" width="760" height="570" allowfullscreen></iframe>
</div>
<p>Bootstrap 4 has a new update with a handful of feature changes. We’ve had quite the lengthy pull request to add responsive containers—big thanks to the developers who contribute to Bootstrap for sticking with it and helping us along the way. Nearly all new features will be carried forward into Bootstrap 5, so feel free to start using them now.</p>
<h2 id="highlights">Highlights</h2>
<p>Here’s what you need to know about v4.4.0. Remember that with every minor and major release of Bootstrap, we ship a new URL for our hosted docs to ensure URLs continue to work.</p>
<ul>
<li><strong>New responsive containers!</strong> Over a year in the making, fluid up to a particular breakpoint, available for all responsive tiers.</li>
<li><strong>New responsive <code>.row-cols</code> classes</strong> for quickly specifying the number of columns across breakpoints. This one is huge for those of you who have asked for responsive card decks.</li>
<li><strong>New <code>escape-svg()</code> function</strong> for simplifying our embedded <code>background-image</code> SVGs for forms and more.</li>
<li><strong>New <code>add()</code> and <code>subtract()</code> functions</strong> for avoiding errors and zero values from CSS’s built in <code>calc</code> feature.</li>
<li><strong>New <code>make-col-auto()</code> mixin</strong> to make our <code>.col-auto</code> class available with custom HTML.</li>
<li>Fixed an issue with Microsoft Edge not picking up <code>:disabled</code> styles by moving selectors to <code>[disabled]</code>.</li>
<li><strong>Deprecated:</strong> <code>bg-variant()</code>, <code>nav-divider()</code>, and <code>form-control-focus()</code> mixins are now deprecated as they’re going away in v5.</li>
<li>Updated our spacing and alignment for modal footer elements like buttons to automatically wrap when space is constrained.</li>
<li>More flexible form control validation styles thanks to fewer chained selectors. Also updated the <code>:invalid</code> validation icon to be an alert instead of an <code>&times;</code> to avoid confusion with browser functionality for clearing the form field value.</li>
<li>Fixed a couple dozen CSS and JS bugs.</li>
<li>Moved to GitHub Actions for CI/CD! Expect more updates to our CI setup over time here while Actions evolves.</li>
<li>Updated documentation to fix links and typos, improved landmarks for secondary navigation, and a new security doc for guidelines on reporting potential vulnerabilities.</li>
</ul>
<p>We’ve shipped a lot more in this release, so be sure to check out the <a href="https://github.com/twbs/bootstrap/issues?q=project%3Atwbs%2Fbootstrap%2F18+is%3Aclosed+sort%3Aupdated-desc">v4.4.0 ship list of closed issues and merged pull requests</a> for more details.</p>
<p><a href="https://getbootstrap.com/docs/4.4/">Head to to the v4.4.0 docs</a> to see the latest in action. The full release has been published to npm and will soon appear on the BootstrapCDN and Rubygems.</p>
<h2 id="support-the-team">Support the team</h2>
<p>Visit our <a href="https://opencollective.com/bootstrap">Open Collective page</a> or our <a href="https://github.com/orgs/twbs/people">team members</a>’ GitHub profiles to help support the maintainers contributing to Bootstrap.</p>
</div><div class="post">
<h1 class="post-title fw-600">
<a href="/2019/11/26/bootstrap-icons/" class="text-decoration-none">
Introducing Bootstrap Icons
</a>
</h1>
<div class="d-flex align-items-center mb-4 text-muted author-info">
<a class="d-flex align-items-center text-muted text-decoration-none" href="https://github.com/mdo" target="_blank" rel="noopener">
<img class="mb-0 me-2 rounded-2" srcset="https://github.com/mdo.png?size=32, https://github.com/mdo.png?size=64 2x"
src="https://github.com/mdo.png?size=32"
alt="" width="32" height="32" loading="lazy">
<span>@mdo</span>
</a>
<span class="d-flex align-items-center ms-3" title="26 Nov 19 00:00 UTC">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" class="me-2" viewBox="0 0 16 16" role="img" fill="currentColor">
<path d="M11 6.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1z"/>
<path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z"/>
</svg>
November 26, 2019
</span>
</div>
<div class="ratio ratio-16x9">
<iframe class="lazy" data-src="https://www.youtube-nocookie.com/embed/eM8Ss28zjcE?rel=0" title="YouTube Video" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" width="760" height="570" allowfullscreen></iframe>
</div>
<p>Say hello to <a href="https://icons.getbootstrap.com/">Bootstrap Icons</a>, our very first icon set that’s designed entirely by our team and open sourced for everyone to use, with or without Bootstrap. It’s still in alpha, but we’re incredibly excited to share it with y’all ahead of our v5 alpha.</p>
<p><a href="https://icons.getbootstrap.com/"><img src="/assets/img/2019/11/bi-docs.png" class="d-block img-fluid mb-2 rounded border" alt="Bootstrap Icons docs" loading="lazy" width="1681" height="1250">
</a></p>
<p>For the longest time, I’ve wanted to design an icon set to better lean how to better draw with different pen tools and to better understand SVGs. In the last several months I’ve used a few different applications, done nearly five style iterations, and finally settled on a single direction. The result? Over 200 icons to start.</p>
<p><img src="/assets/img/2019/11/bi-icons.png" class="d-block img-fluid mb-2 rounded border" alt="Bootstrap Icons full list" loading="lazy" width="2280" height="8382">
</p>
<p>I’ve designed these initial icons in Figma and exported them as SVGs. The plan is to share that Figma file publicly once it’s cleaned up and the icon set is more stable. While Bootstrap Icons are first and foremost designed to work with Bootstrap’s components, they can be used anywhere. They’re an entirely <a href="https://github.com/twbs/icons">separate project</a> and package from Bootstrap, so you can easily use them in any project, or use any other icon set alongside Bootstrap’s CSS and JavaScript.</p>
<p>They’re also open sourced under the MIT license, so you’re free to download, use, and customize as you need. This is an alpha release for now, so bear with us as we get familiar with creating and managing hundreds of SVGs. and more icons will be added over time.</p>
<p>Head to <a href="https://icons.getbootstrap.com">https://icons.getbootstrap.com</a> to explore and download!</p>
</div><div class="post">
<h1 class="post-title fw-600">
<a href="/2019/07/24/lts-plan/" class="text-decoration-none">
Introducing our Long Term Support plan
</a>
</h1>
<div class="d-flex align-items-center mb-4 text-muted author-info">
<a class="d-flex align-items-center text-muted text-decoration-none" href="https://github.com/mdo" target="_blank" rel="noopener">
<img class="mb-0 me-2 rounded-2" srcset="https://github.com/mdo.png?size=32, https://github.com/mdo.png?size=64 2x"
src="https://github.com/mdo.png?size=32"
alt="" width="32" height="32" loading="lazy">
<span>@mdo</span>
</a>
<span class="d-flex align-items-center ms-3" title="24 Jul 19 00:00 UTC">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" class="me-2" viewBox="0 0 16 16" role="img" fill="currentColor">
<path d="M11 6.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1z"/>
<path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z"/>
</svg>
July 24, 2019
</span>
</div>
<div class="ratio ratio-16x9">
<iframe class="lazy" data-src="https://www.youtube-nocookie.com/embed/2HuiH-0R6a0?rel=0" title="YouTube Video" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" width="760" height="570" allowfullscreen></iframe>
</div>
<p>Today we’re formally announcing our <a href="https://github.com/twbs/release">Long Term Support plan</a>, a documented approach aimed at strengthening the stability and frequency of releases. As part of this initiative, each major version of Bootstrap will receive at least six months of support after it is retired, followed by six months of critical bug fixes and security updates.</p>
<p>Starting today, Bootstrap 3 will move to end of life, and will no longer receive critical security updates.</p>
<p>Bootstrap 4 will move to Long Term Support after we release <code>v4.4</code> and will no longer receive new features from then on. It will continue to receive bug fixes, security updates, and documentation updates.</p>
<p>Bootstrap 5 is under active development. You can follow our progress <a href="https://github.com/twbs/bootstrap">on GitHub</a>.</p>
<p>A special thanks to <a href="https://github.com/XhmikosR">@XhmikosR</a> for his tireless work in pushing us forward.</p>
</div><div class="post">
<h1 class="post-title fw-600">
<a href="/2019/02/13/bootstrap-4-3-1-and-3-4-1/" class="text-decoration-none">
Bootstrap 3.4.1 and 4.3.1
</a>
</h1>
<div class="d-flex align-items-center mb-4 text-muted author-info">
<a class="d-flex align-items-center text-muted text-decoration-none" href="https://github.com/mdo" target="_blank" rel="noopener">
<img class="mb-0 me-2 rounded-2" srcset="https://github.com/mdo.png?size=32, https://github.com/mdo.png?size=64 2x"
src="https://github.com/mdo.png?size=32"
alt="" width="32" height="32" loading="lazy">
<span>@mdo</span>
</a>
<span class="d-flex align-items-center ms-3" title="13 Feb 19 00:00 UTC">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" class="me-2" viewBox="0 0 16 16" role="img" fill="currentColor">
<path d="M11 6.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1z"/>
<path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z"/>
</svg>
February 13, 2019
</span>
</div>
<p>Today we’re shipping <a href="https://github.com/twbs/bootstrap/releases/tag/v4.3.1">Bootstrap v4.3.1</a> and <a href="https://github.com/twbs/bootstrap/releases/tag/v3.4.1">v3.4.1</a> to patch an XSS vulnerability, CVE-2019-8331. Also included in v4.3.1 is a small fix to some RFS (responsive font sizes) mixins that were added in v4.3.0.</p>
<p>Earlier this week a developer reported an XSS issue similar to the <code>data-target</code> vulnerability that was fixed in v4.1.2 and v3.4.0: the <code>data-template</code> attribute for our tooltip and popover plugins lacked proper XSS sanitization of the HTML that can be passed into the attribute’s value.</p>
<p>To resolve the issue, we’ve implemented a new JavaScript sanitizer to only allow whitelisted HTML elements in data attribute. You may modify our sanitization implementation to customize the HTML element whitelist, totally disable the sanitization, or pass your own sanitize function (useful if you use your own library). However, for added protection, there is no way to modify the sanitization via data attributes—you must modify these plugin options via the JavaScript API.</p>
<p>Those who have modified the default templates, please <a href="https://getbootstrap.com/docs/4.3/getting-started/javascript/#sanitizer">read the new v4.3 sanitizer docs</a> or the <a href="https://getbootstrap.com/docs/3.4/javascript/#js-sanitizer">new v3.4 sanitizer docs</a>.</p>
<p>In light of this vulnerability, we’re also auditing our security reporting workflows to ensure they’re up to date. This will include steps like adding a <code>SECURITY.md</code> file to our repository and ensuring our private channels and processes are up to date and documented with the team.</p>
<p>Thank you to <a href="https://www.drupal.org/u/poiu">poiu</a> for reporting the vulnerability to the <a href="https://www.drupal.org/project/bootstrap">Bootstrap Drupal project</a> and <a href="https://www.drupal.org/u/markcarver">Mark Carver</a> from the <a href="https://www.drupal.org/project/bootstrap">Bootstrap Drupal project</a> for responsibly disclosing the issue to us. Also a massive thank you to <a href="https://github.com/johann-s">@Johann-S</a>, <a href="https://github.com/xhmikosr">@Xhmikosr</a>, and <a href="https://github.com/bardiharborow">@bardiharborow</a> on our team for the fast turnaround on today’s releases.</p>
</div><div class="post">
<h1 class="post-title fw-600">
<a href="/2019/02/11/bootstrap-4-3-0/" class="text-decoration-none">
Bootstrap 4.3.0
</a>
</h1>
<div class="d-flex align-items-center mb-4 text-muted author-info">
<a class="d-flex align-items-center text-muted text-decoration-none" href="https://github.com/mdo" target="_blank" rel="noopener">
<img class="mb-0 me-2 rounded-2" srcset="https://github.com/mdo.png?size=32, https://github.com/mdo.png?size=64 2x"
src="https://github.com/mdo.png?size=32"
alt="" width="32" height="32" loading="lazy">
<span>@mdo</span>
</a>
<span class="d-flex align-items-center ms-3" title="11 Feb 19 00:00 UTC">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" class="me-2" viewBox="0 0 16 16" role="img" fill="currentColor">
<path d="M11 6.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1z"/>
<path d="M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z"/>
</svg>
February 11, 2019
</span>
</div>
<div class="ratio ratio-16x9">
<iframe class="lazy" data-src="https://www.youtube-nocookie.com/embed/htgr3pvBr-I?rel=0" title="YouTube Video" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" width="760" height="570" allowfullscreen></iframe>
</div>
<p>Bootstrap v4.3 has landed with over 120 combined closed issues and merged pull requests. This release brings improvements to our utilities, some prep work for moving on to v5’s development, and the standard bug fixes and documentation updates.</p>
<p>During our last release, we shared a small preview of where we’re taking the project next. That’s getting clearer in the coming weeks as our attention turns towards embracing Hugo for ultra fast docs development, removing jQuery in favor of regular JavaScript, and addressing our growing code base.</p>
<p>Keep reading for v4.3 highlights, and see you soon with more details on v5!</p>
<h2 id="highlights">Highlights</h2>
<p>We’ve added some new utilities and deprecated some unused code. Here are the key changes in v4.3, broken down by new, improved, fixed, and deprecated.</p>
<ul>
<li><strong>New:</strong> Added <code>.stretched-link</code> utility to make any anchor the size of it’s nearest <code>position: relative</code> parent, perfect for entirely clickable cards!</li>
<li><strong>New:</strong> Added <code>.text-break</code> utility for applying <code>word-break: break-word</code></li>
<li><strong>New:</strong> Added <code>.rounded-sm</code> and <code>.rounded-lg</code> for small and large <code>border-radius</code>.</li>
<li><strong>New:</strong> Added <code>.modal-dialog-scrollable</code> modifier class for scrolling content <em>within</em> a modal.</li>
<li><strong>New:</strong> Added responsive <code>.list-group-horizontal</code> modifier classes for displaying list groups as a horizontal row.</li>
<li><strong>Improved:</strong> Reduced our compiled CSS by using <code>null</code> for variables that by default inherit their values from other elements (e.g., <code>$headings-color</code> was <code>inherit</code> and is now <code>null</code> until you modifier it in your custom CSS).</li>
<li><strong>Improved:</strong> Badge focus styles now match their <code>background-color</code> like our buttons.</li>
<li><strong>Fixed:</strong> Silenced bad selectors in our JS plugins for the <code>href</code> HTML attribute to avoid JavaScript errors. Please try to use <a href="https://www.w3.org/TR/CSS21/syndata.html#value-def-identifier">valid selectors</a> or the <code>data-target</code> HTML attribute/<code>target</code> option where available.</li>
<li><strong>Fixed:</strong> Reverted v4.2.1’s change to the breakpoint and grid container Sass maps that blocked folks from upgrading when modifying those default variables.</li>
<li><strong>Fixed:</strong> Restored <code>white-space: nowrap</code> to <code>.dropdown-toggle</code> (before v4.2.1 it was on all <code>.btn</code>s) so carets don’t wrap to new lines.</li>
<li><strong>Deprecated:</strong> <code>img-retina</code>, <code>invisible</code>, <code>float</code>, and <code>size</code> mixins are now deprecated and will be removed in v5.</li>
</ul>
<p>Checkout the full <a href="https://github.com/twbs/bootstrap/issues/27893">v4.3.0 ship list</a> and <a href="https://github.com/twbs/bootstrap/projects/16">GitHub project</a> for the full details.</p>
<p><a href="https://getbootstrap.com/docs/4.3/">Head to to the v4.3.x docs</a> to see the latest in action. The full release has been published to npm and will soon appear on the Bootstrap CDN and Rubygems.</p>
<h2 id="introducing-responsive-font-sizes">Introducing responsive font sizes</h2>
<p><img src="/assets/img/2019/02/rfs.png" class="d-block img-fluid mb-2 rounded border" alt="Responsive font-sizes" loading="lazy" width="1180" height="700">
</p>
<p>Our biggest new addition to Bootstrap in v4.3 is responsive font sizes, a <a href="https://github.com/twbs/rfs">new project in the Bootstrap GitHub org</a> to automate calculate an appropriate <code>font-size</code> based on the dimensions of a visitor’s device or browser viewport. Here’s how it works:</p>
<ul>
<li>
<p>All <code>font-size</code> properties have been switched to the <code>@include font-size()</code> mixin. Our Stylelint configuration now prevents the usage of <code>font-size</code> property.</p>
</li>
<li>
<p>Disabled by default, you can opt into this new behavior by toggling the <code>$enable-responsive-font-sizes</code> boolean variable.</p>
</li>
<li>
<p><code>font-size</code>s are entirely configurable via Sass. Be sure to read the docs for how to modify the scales, variables, and more.</p>
</li>
</ul>
<p>While responsive font-sizes are disabled by default, we’ve enabled them in the custom CSS that powers our docs starting with v4.3. Please share feedback with us via GitHub issues or on Twitter. We’ve added some light guidance to <a href="https://getbootstrap.com/docs/4.3/content/typography/#responsive-font-sizes">our Typography docs</a> to explain the feature. You can also learn more by <a href="https://github.com/twbs/rfs">reading the rfs project documentation</a>.</p>
<h2 id="open-collective">Open Collective</h2>
<p>Last December we launched our <a href="https://opencollective.com/bootstrap">Open Collective page</a> with our <a href="/2018/12/13/bootstrap-3-4-0/">v3.4 release</a> to help support the maintainers contributing to Bootstrap. The team has been very excited about this as a way to be transparent about maintainer costs (both time and money), as well as recognition of efforts.</p>
<h2 id="branches-hugo-and-jquery">Branches, Hugo, and jQuery</h2>
<p>Right after shipping v4.3, we’ll be tackling a few key changes on our road to active v5 development. These are larger changes to how we maintain and develop Bootstrap and are considered foundational for v5.</p>
<ul>
<li>
<p><strong>Improving our branches for development.</strong> <code>master</code> will become our new <code>v3-dev</code> branch. <code>v4-dev</code> will stay as-is, but we’ll cut a new <code>master</code> branch from there to develop v5.</p>
</li>
<li>
<p><strong>We’re moving to Hugo!</strong> Jekyll has been great, but it’s starting to slow us down in local development. We’ll be making changes to our dependencies to support this move, and there’s already a pull request in progress and near completion for the change. <a href="https://github.com/twbs/bootstrap/pull/28014">Follow along</a> to see what’s changing.</p>
</li>
<li>
<p><strong>We’re dropping jQuery for regular JavaScript.</strong> The cat is out of the bag—we’re dropping our largest client-side dependency for regular JavaScript. Similar to the Hugo move, we’ve been working on this for a long time and have a <a href="https://github.com/twbs/bootstrap/pull/23586">pull request in progress</a> and near completion.</p>
</li>
</ul>
<p>We’ll have even more to share soon around v5’s plans after we tackle these bigger items. In the meantime, keep the feedback coming on GitHub and Twitter!</p>
</div>
</div>
<div class="pagination"><a class="pagination-item older" href="/page/11/">Older</a>
<a class="pagination-item newer" href="/page/9/">Newer</a>
</div>
</div>
</div>
</div>
</div>
<footer class="bd-footer py-4 py-md-5 mt-5 bg-light">
<div class="container py-4 py-md-5 px-4 px-md-3">
<div class="row">
<div class="col-lg-3 mb-3">
<a class="d-inline-flex align-items-center mb-2 link-dark text-decoration-none" href="/" aria-label="Bootstrap">
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="32" class="d-block me-2" viewBox="0 0 118 94" role="img"><path fill-rule="evenodd" clip-rule="evenodd" d="M24.509 0c-6.733 0-11.715 5.893-11.492 12.284.214 6.14-.064 14.092-2.066 20.577C8.943 39.365 5.547 43.485 0 44.014v5.972c5.547.529 8.943 4.649 10.951 11.153 2.002 6.485 2.28 14.437 2.066 20.577C12.794 88.106 17.776 94 24.51 94H93.5c6.733 0 11.714-5.893 11.491-12.284-.214-6.14.064-14.092 2.066-20.577 2.009-6.504 5.396-10.624 10.943-11.153v-5.972c-5.547-.529-8.934-4.649-10.943-11.153-2.002-6.484-2.28-14.437-2.066-20.577C105.214 5.894 100.233 0 93.5 0H24.508zM80 57.863C80 66.663 73.436 72 62.543 72H44a2 2 0 01-2-2V24a2 2 0 012-2h18.437c9.083 0 15.044 4.92 15.044 12.474 0 5.302-4.01 10.049-9.119 10.88v.277C75.317 46.394 80 51.21 80 57.863zM60.521 28.34H49.948v14.934h8.905c6.884 0 10.68-2.772 10.68-7.727 0-4.643-3.264-7.207-9.012-7.207zM49.948 49.2v16.458H60.91c7.167 0 10.964-2.876 10.964-8.281 0-5.406-3.903-8.178-11.425-8.178H49.948z" fill="currentColor"/></svg>
<span class="fs-5">Bootstrap</span>
</a>
<ul class="list-unstyled small text-muted">
<li class="mb-2">Designed and built with all the love in the world by the <a href="https://getbootstrap.com/docs/5.2/about/team/">Bootstrap team</a> with the help of <a href="https://github.com/twbs/blog/graphs/contributors">our contributors</a>.</li>
</ul>
</div>
<div class="col-6 col-lg-2 offset-lg-1 mb-3">
<h5>Links</h5>
<ul class="list-unstyled">
<li class="mb-2"><a href="https://getbootstrap.com/">Home</a></li>
<li class="mb-2"><a href="https://getbootstrap.com/docs/5.2/">Docs</a></li>
<li class="mb-2"><a href="https://getbootstrap.com/docs/5.2/examples/">Examples</a></li>
<li class="mb-2"><a href="https://icons.getbootstrap.com/">Icons</a></li>
<li class="mb-2"><a href="https://themes.getbootstrap.com/">Themes</a></li>
<li class="mb-2"><a href="https://blog.getbootstrap.com/">Blog</a></li>
<li class="mb-2"><a href="">Swag Store</a></li>
</ul>
</div>
<div class="col-6 col-lg-2 mb-3">
<h5>Guides</h5>
<ul class="list-unstyled">
<li class="mb-2"><a href="https://getbootstrap.com/docs/5.2/getting-started/">Getting started</a></li>
<li class="mb-2"><a href="https://getbootstrap.com/docs/5.2/examples/starter-template/">Starter template</a></li>
<li class="mb-2"><a href="https://getbootstrap.com/docs/5.2/getting-started/webpack/">Webpack</a></li>
<li class="mb-2"><a href="https://getbootstrap.com/docs/5.2/getting-started/parcel/">Parcel</a></li>
<li class="mb-2"><a href="https://getbootstrap.com/docs/5.2/getting-started/vite/">Vite</a></li>
</ul>
</div>
<div class="col-6 col-lg-2 mb-3">
<h5>Projects</h5>
<ul class="list-unstyled">
<li class="mb-2"><a href="https://github.com/twbs/bootstrap">Bootstrap 5</a></li>
<li class="mb-2"><a href="https://github.com/twbs/bootstrap/tree/v4-dev">Bootstrap 4</a></li>
<li class="mb-2"><a href="https://github.com/twbs/icons">Icons</a></li>
<li class="mb-2"><a href="https://github.com/twbs/rfs">RFS</a></li>
<li class="mb-2"><a href="https://github.com/twbs/bootstrap-npm-starter">npm starter</a></li>
</ul>
</div>
<div class="col-6 col-lg-2 mb-3">
<h5>Community</h5>
<ul class="list-unstyled">
<li class="mb-2"><a href="https://github.com/twbs/bootstrap/issues">Issues</a></li>
<li class="mb-2"><a href="https://github.com/twbs/bootstrap/discussions">Discussions</a></li>
<li class="mb-2"><a href="https://github.com/sponsors/twbs">Corporate sponsors</a></li>
<li class="mb-2"><a href="https://opencollective.com/bootstrap">Open Collective</a></li>
<li class="mb-2"><a href="https://stackoverflow.com/questions/tagged/bootstrap-5">Stack Overflow</a></li>
</ul>
</div>
</div>
</div>
</footer>
<script async src="/js/bootstrap.min.js"></script>
<script>
(function(w, d) {
var b = d.getElementsByTagName('body')[0];
var s = d.createElement('script');
var io = 'IntersectionObserver' in w && 'IntersectionObserverEntry' in w &&
'intersectionRatio' in w.IntersectionObserverEntry.prototype &&
'isIntersecting' in w.IntersectionObserverEntry.prototype;
var v = io ? '17.x' : '8.x';
s.async = true;
s.src = '/assets/js/vendor/lazyload.' + v + '.iife.min.js';
w.lazyLoadOptions = {
elements_selector: '.lazy',
threshold: 150
};
b.appendChild(s);
}(window, document));
</script>
</body>
</html>
|
