Min Block Size

Set an element's minimum logical block size.

Widely available

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

Chrome
Edge
Firefox
Safari

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

Responsiveness

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

Target viewport sizes with breakpoint prefixes.

@sm:min-ys-(value)
Small≥640px
@md:min-ys-(value)
Medium≥768px
@lg:min-ys-(value)
Large≥1024px
@xxl:min-ys-(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:min-ys-(value)

Negative Values

Use negative variants to apply negative dimensions.

Use the -- syntax to apply negative numeric values.

Syntax:min-ys--(value)