Margin Top

Set an element's top margin.

Widely available

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

Chrome
Edge
Firefox
Safari

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

Responsiveness

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

Target viewport sizes with breakpoint prefixes.

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

Negative Values

Use negative variants to apply negative margins.

Use the -- syntax to apply negative numeric values.

Syntax:mt--(value)