Padding Left

Set an element's left padding.

Widely available

This feature is well established and works across many devices and browser versions.

Chrome
Edge
Firefox
Safari

pl-0
padding-left: 0;
pl-1
padding-left: .25rem;
pl-2
padding-left: .5rem;
pl-3
padding-left: .75rem;
pl-4
padding-left: 1rem;
pl-5
padding-left: 1.25rem;
pl-6
padding-left: 1.5rem;
pl-7
padding-left: 1.75rem;
pl-8
padding-left: 2rem;
pl-9
padding-left: 2.25rem;
pl-10
padding-left: 2.5rem;
pl-11
padding-left: 2.75rem;
pl-12
padding-left: 3rem;
pl-13
padding-left: 3.25rem;
pl-14
padding-left: 3.5rem;
pl-15
padding-left: 3.75rem;
pl-16
padding-left: 4rem;
pl-17
padding-left: 4.25rem;
pl-18
padding-left: 4.5rem;
pl-19
padding-left: 4.75rem;
pl-20
padding-left: 5rem;
pl-21
padding-left: 5.25rem;
pl-22
padding-left: 5.5rem;
pl-23
padding-left: 5.75rem;
pl-24
padding-left: 6rem;
pl-25
padding-left: 6.25rem;
pl-26
padding-left: 6.5rem;
pl-27
padding-left: 6.75rem;
pl-28
padding-left: 7rem;
pl-29
padding-left: 7.25rem;
pl-30
padding-left: 7.5rem;
pl-31
padding-left: 7.75rem;
pl-32
padding-left: 8rem;
pl-33
padding-left: 8.25rem;
pl-34
padding-left: 8.5rem;
pl-35
padding-left: 8.75rem;
pl-36
padding-left: 9rem;
pl-37
padding-left: 9.25rem;
pl-38
padding-left: 9.5rem;
pl-39
padding-left: 9.75rem;
pl-40
padding-left: 10rem;
pl-41
padding-left: 10.25rem;
pl-42
padding-left: 10.5rem;
pl-43
padding-left: 10.75rem;
pl-44
padding-left: 11rem;
pl-45
padding-left: 11.25rem;
pl-46
padding-left: 11.5rem;
pl-47
padding-left: 11.75rem;
pl-48
padding-left: 12rem;
pl-49
padding-left: 12.25rem;
pl-50
padding-left: 12.5rem;
pl-51
padding-left: 12.75rem;
pl-52
padding-left: 13rem;
pl-53
padding-left: 13.25rem;
pl-54
padding-left: 13.5rem;
pl-55
padding-left: 13.75rem;
pl-56
padding-left: 14rem;
pl-57
padding-left: 14.25rem;
pl-58
padding-left: 14.5rem;
pl-59
padding-left: 14.75rem;
pl-60
padding-left: 15rem;
pl-61
padding-left: 15.25rem;
pl-62
padding-left: 15.5rem;
pl-63
padding-left: 15.75rem;
pl-64
padding-left: 16rem;
pl-65
padding-left: 16.25rem;
pl-66
padding-left: 16.5rem;
pl-67
padding-left: 16.75rem;
pl-68
padding-left: 17rem;
pl-69
padding-left: 17.25rem;
pl-70
padding-left: 17.5rem;
pl-71
padding-left: 17.75rem;
pl-72
padding-left: 18rem;
pl-73
padding-left: 18.25rem;
pl-74
padding-left: 18.5rem;
pl-75
padding-left: 18.75rem;
pl-76
padding-left: 19rem;
pl-77
padding-left: 19.25rem;
pl-78
padding-left: 19.5rem;
pl-79
padding-left: 19.75rem;
pl-80
padding-left: 20rem;
pl-81
padding-left: 20.25rem;
pl-82
padding-left: 20.5rem;
pl-83
padding-left: 20.75rem;
pl-84
padding-left: 21rem;
pl-85
padding-left: 21.25rem;
pl-86
padding-left: 21.5rem;
pl-87
padding-left: 21.75rem;
pl-88
padding-left: 22rem;
pl-89
padding-left: 22.25rem;
pl-90
padding-left: 22.5rem;
pl-91
padding-left: 22.75rem;
pl-92
padding-left: 23rem;
pl-93
padding-left: 23.25rem;
pl-94
padding-left: 23.5rem;
pl-95
padding-left: 23.75rem;
pl-96
padding-left: 24rem;
pl-97
padding-left: 24.25rem;
pl-98
padding-left: 24.5rem;
pl-99
padding-left: 24.75rem;
pl-100
padding-left: 25rem;
pl-101
padding-left: 25.25rem;
pl-102
padding-left: 25.5rem;
pl-103
padding-left: 25.75rem;
pl-104
padding-left: 26rem;
pl-105
padding-left: 26.25rem;
pl-106
padding-left: 26.5rem;
pl-107
padding-left: 26.75rem;
pl-108
padding-left: 27rem;
pl-109
padding-left: 27.25rem;
pl-110
padding-left: 27.5rem;
pl-111
padding-left: 27.75rem;
pl-112
padding-left: 28rem;
pl-113
padding-left: 28.25rem;
pl-114
padding-left: 28.5rem;
pl-115
padding-left: 28.75rem;
pl-116
padding-left: 29rem;
pl-117
padding-left: 29.25rem;
pl-118
padding-left: 29.5rem;
pl-119
padding-left: 29.75rem;
pl-120
padding-left: 30rem;
pl-121
padding-left: 30.25rem;
pl-122
padding-left: 30.5rem;
pl-123
padding-left: 30.75rem;
pl-124
padding-left: 31rem;
pl-125
padding-left: 31.25rem;
pl-126
padding-left: 31.5rem;
pl-127
padding-left: 31.75rem;
pl-128
padding-left: 32rem;
pl-129
padding-left: 32.25rem;
pl-130
padding-left: 32.5rem;
pl-131
padding-left: 32.75rem;
pl-132
padding-left: 33rem;
pl-133
padding-left: 33.25rem;
pl-134
padding-left: 33.5rem;
pl-135
padding-left: 33.75rem;
pl-136
padding-left: 34rem;
pl-137
padding-left: 34.25rem;
pl-138
padding-left: 34.5rem;
pl-139
padding-left: 34.75rem;
pl-140
padding-left: 35rem;
pl-141
padding-left: 35.25rem;
pl-142
padding-left: 35.5rem;
pl-143
padding-left: 35.75rem;
pl-144
padding-left: 36rem;
pl-145
padding-left: 36.25rem;
pl-146
padding-left: 36.5rem;
pl-147
padding-left: 36.75rem;
pl-148
padding-left: 37rem;
pl-149
padding-left: 37.25rem;
pl-150
padding-left: 37.5rem;
pl-151
padding-left: 37.75rem;
pl-152
padding-left: 38rem;
pl-153
padding-left: 38.25rem;
pl-154
padding-left: 38.5rem;
pl-155
padding-left: 38.75rem;
pl-156
padding-left: 39rem;
pl-157
padding-left: 39.25rem;
pl-158
padding-left: 39.5rem;
pl-159
padding-left: 39.75rem;
pl-160
padding-left: 40rem;
pl-161
padding-left: 40.25rem;
pl-162
padding-left: 40.5rem;
pl-163
padding-left: 40.75rem;
pl-164
padding-left: 41rem;
pl-165
padding-left: 41.25rem;
pl-166
padding-left: 41.5rem;
pl-167
padding-left: 41.75rem;
pl-168
padding-left: 42rem;
pl-169
padding-left: 42.25rem;
pl-170
padding-left: 42.5rem;
pl-171
padding-left: 42.75rem;
pl-172
padding-left: 43rem;
pl-173
padding-left: 43.25rem;
pl-174
padding-left: 43.5rem;
pl-175
padding-left: 43.75rem;
pl-176
padding-left: 44rem;
pl-177
padding-left: 44.25rem;
pl-178
padding-left: 44.5rem;
pl-179
padding-left: 44.75rem;
pl-180
padding-left: 45rem;
pl-181
padding-left: 45.25rem;
pl-182
padding-left: 45.5rem;
pl-183
padding-left: 45.75rem;
pl-184
padding-left: 46rem;
pl-185
padding-left: 46.25rem;
pl-186
padding-left: 46.5rem;
pl-187
padding-left: 46.75rem;
pl-188
padding-left: 47rem;
pl-189
padding-left: 47.25rem;
pl-190
padding-left: 47.5rem;
pl-191
padding-left: 47.75rem;
pl-192
padding-left: 48rem;
pl-193
padding-left: 48.25rem;
pl-194
padding-left: 48.5rem;
pl-195
padding-left: 48.75rem;
pl-196
padding-left: 49rem;
pl-197
padding-left: 49.25rem;
pl-198
padding-left: 49.5rem;
pl-199
padding-left: 49.75rem;
pl-200
padding-left: 50rem;
pl-201
padding-left: 50.25rem;
pl-202
padding-left: 50.5rem;
pl-203
padding-left: 50.75rem;
pl-204
padding-left: 51rem;
pl-205
padding-left: 51.25rem;
pl-206
padding-left: 51.5rem;
pl-207
padding-left: 51.75rem;
pl-208
padding-left: 52rem;
pl-209
padding-left: 52.25rem;
pl-210
padding-left: 52.5rem;
pl-211
padding-left: 52.75rem;
pl-212
padding-left: 53rem;
pl-213
padding-left: 53.25rem;
pl-214
padding-left: 53.5rem;
pl-215
padding-left: 53.75rem;
pl-216
padding-left: 54rem;
pl-217
padding-left: 54.25rem;
pl-218
padding-left: 54.5rem;
pl-219
padding-left: 54.75rem;
pl-220
padding-left: 55rem;
pl-221
padding-left: 55.25rem;
pl-222
padding-left: 55.5rem;
pl-223
padding-left: 55.75rem;
pl-224
padding-left: 56rem;
pl-225
padding-left: 56.25rem;
pl-226
padding-left: 56.5rem;
pl-227
padding-left: 56.75rem;
pl-228
padding-left: 57rem;
pl-229
padding-left: 57.25rem;
pl-230
padding-left: 57.5rem;
pl-231
padding-left: 57.75rem;
pl-232
padding-left: 58rem;
pl-233
padding-left: 58.25rem;
pl-234
padding-left: 58.5rem;
pl-235
padding-left: 58.75rem;
pl-236
padding-left: 59rem;
pl-237
padding-left: 59.25rem;
pl-238
padding-left: 59.5rem;
pl-239
padding-left: 59.75rem;
pl-240
padding-left: 60rem;
pl-241
padding-left: 60.25rem;
pl-242
padding-left: 60.5rem;
pl-243
padding-left: 60.75rem;
pl-244
padding-left: 61rem;
pl-245
padding-left: 61.25rem;
pl-246
padding-left: 61.5rem;
pl-247
padding-left: 61.75rem;
pl-248
padding-left: 62rem;
pl-249
padding-left: 62.25rem;
pl-250
padding-left: 62.5rem;
pl-251
padding-left: 62.75rem;
pl-252
padding-left: 63rem;
pl-253
padding-left: 63.25rem;
pl-254
padding-left: 63.5rem;
pl-255
padding-left: 63.75rem;
pl-256
padding-left: 64rem;
pl-257
padding-left: 64.25rem;
pl-258
padding-left: 64.5rem;
pl-259
padding-left: 64.75rem;
pl-260
padding-left: 65rem;
pl-261
padding-left: 65.25rem;
pl-262
padding-left: 65.5rem;
pl-263
padding-left: 65.75rem;
pl-264
padding-left: 66rem;
pl-265
padding-left: 66.25rem;
pl-266
padding-left: 66.5rem;
pl-267
padding-left: 66.75rem;
pl-268
padding-left: 67rem;
pl-269
padding-left: 67.25rem;
pl-270
padding-left: 67.5rem;
pl-271
padding-left: 67.75rem;
pl-272
padding-left: 68rem;
pl-273
padding-left: 68.25rem;
pl-274
padding-left: 68.5rem;
pl-275
padding-left: 68.75rem;
pl-276
padding-left: 69rem;
pl-277
padding-left: 69.25rem;
pl-278
padding-left: 69.5rem;
pl-279
padding-left: 69.75rem;
pl-280
padding-left: 70rem;
pl-281
padding-left: 70.25rem;
pl-282
padding-left: 70.5rem;
pl-283
padding-left: 70.75rem;
pl-284
padding-left: 71rem;
pl-285
padding-left: 71.25rem;
pl-286
padding-left: 71.5rem;
pl-287
padding-left: 71.75rem;
pl-288
padding-left: 72rem;
pl-289
padding-left: 72.25rem;
pl-290
padding-left: 72.5rem;
pl-291
padding-left: 72.75rem;
pl-292
padding-left: 73rem;
pl-293
padding-left: 73.25rem;
pl-294
padding-left: 73.5rem;
pl-295
padding-left: 73.75rem;
pl-296
padding-left: 74rem;
pl-297
padding-left: 74.25rem;
pl-298
padding-left: 74.5rem;
pl-299
padding-left: 74.75rem;
pl-300
padding-left: 75rem;
pl-301
padding-left: 75.25rem;
pl-302
padding-left: 75.5rem;
pl-303
padding-left: 75.75rem;
pl-304
padding-left: 76rem;
pl-305
padding-left: 76.25rem;
pl-306
padding-left: 76.5rem;
pl-307
padding-left: 76.75rem;
pl-308
padding-left: 77rem;
pl-309
padding-left: 77.25rem;
pl-310
padding-left: 77.5rem;
pl-311
padding-left: 77.75rem;
pl-312
padding-left: 78rem;
pl-313
padding-left: 78.25rem;
pl-314
padding-left: 78.5rem;
pl-315
padding-left: 78.75rem;
pl-316
padding-left: 79rem;
pl-317
padding-left: 79.25rem;
pl-318
padding-left: 79.5rem;
pl-319
padding-left: 79.75rem;
pl-320
padding-left: 80rem;
pl-321
padding-left: 80.25rem;
pl-322
padding-left: 80.5rem;
pl-323
padding-left: 80.75rem;
pl-324
padding-left: 81rem;
pl-325
padding-left: 81.25rem;
pl-326
padding-left: 81.5rem;
pl-327
padding-left: 81.75rem;
pl-328
padding-left: 82rem;
pl-329
padding-left: 82.25rem;
pl-330
padding-left: 82.5rem;
pl-331
padding-left: 82.75rem;
pl-332
padding-left: 83rem;
pl-333
padding-left: 83.25rem;
pl-334
padding-left: 83.5rem;
pl-335
padding-left: 83.75rem;
pl-336
padding-left: 84rem;
pl-337
padding-left: 84.25rem;
pl-338
padding-left: 84.5rem;
pl-339
padding-left: 84.75rem;
pl-340
padding-left: 85rem;
pl-341
padding-left: 85.25rem;
pl-342
padding-left: 85.5rem;
pl-343
padding-left: 85.75rem;
pl-344
padding-left: 86rem;
pl-345
padding-left: 86.25rem;
pl-346
padding-left: 86.5rem;
pl-347
padding-left: 86.75rem;
pl-348
padding-left: 87rem;
pl-349
padding-left: 87.25rem;
pl-350
padding-left: 87.5rem;
pl-351
padding-left: 87.75rem;
pl-352
padding-left: 88rem;
pl-353
padding-left: 88.25rem;
pl-354
padding-left: 88.5rem;
pl-355
padding-left: 88.75rem;
pl-356
padding-left: 89rem;
pl-357
padding-left: 89.25rem;
pl-358
padding-left: 89.5rem;
pl-359
padding-left: 89.75rem;
pl-360
padding-left: 90rem;
pl-361
padding-left: 90.25rem;
pl-362
padding-left: 90.5rem;
pl-363
padding-left: 90.75rem;
pl-364
padding-left: 91rem;
pl-365
padding-left: 91.25rem;
pl-366
padding-left: 91.5rem;
pl-367
padding-left: 91.75rem;
pl-368
padding-left: 92rem;
pl-369
padding-left: 92.25rem;
pl-370
padding-left: 92.5rem;
pl-371
padding-left: 92.75rem;
pl-372
padding-left: 93rem;
pl-373
padding-left: 93.25rem;
pl-374
padding-left: 93.5rem;
pl-375
padding-left: 93.75rem;
pl-376
padding-left: 94rem;
pl-377
padding-left: 94.25rem;
pl-378
padding-left: 94.5rem;
pl-379
padding-left: 94.75rem;
pl-380
padding-left: 95rem;
pl-381
padding-left: 95.25rem;
pl-382
padding-left: 95.5rem;
pl-383
padding-left: 95.75rem;
pl-384
padding-left: 96rem;
pl-auto
padding-left: auto;
pl-px
padding-left: 1px;

Responsiveness

Use breakpoint prefixes to target different screen sizes. Styles apply from the breakpoint & up.

Target viewport sizes with breakpoint prefixes.

@sm:pl-(value)
Small≥640px
@md:pl-(value)
Medium≥768px
@lg:pl-(value)
Large≥1024px
@xxl:pl-(value)
Extra Large≥1536px

Hover State

Apply styles conditionally on hover using the h: prefix.

Add the h: prefix to apply styles only when the user hovers over the element.

Syntax:h:pl-(value)