Right

Set the right placement of positioned elements.

Widely available

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

Chrome
Edge
Firefox
Safari

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

Responsiveness

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

Target viewport sizes with breakpoint prefixes.

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

Negative Values

Use negative variants to position in the opposite direction.

Use the -- syntax to apply negative numeric values.

Syntax:r--(value)