Space Margin

Create space outside of an element with simple margins in a range of sizes. Negative margin sizes are also available.

margin-[number]

<div class="margin-10"></div>

Place a <div> tag on the element for which you want negative space at the bottom on the outside, and apply the margin-10 class. The margin-auto class is also available for horizontal centering.

margin-1

margin-2

margin-3

margin-4

margin-5

margin-6

margin-7

margin-8

margin-9

margin-10

margin-11

margin-12

margin-13

margin-14

margin-15

margin-16

margin-17

margin-18

margin-19

margin-20

margin-21

margin-22

margin-23

margin-24

margin-25

margin-top-[number]

Corresponding negative top margins are available written in the format of margin-top-25-negative, margin-top-25-negative-before, and margin-top-25-negative-after.

margin-top-1

margin-top-2

margin-top-3

margin-top-4

margin-top-5

margin-top-6

margin-top-7

margin-top-8

margin-top-9

margin-top-10

margin-top-11

margin-top-12

margin-top-13

margin-top-14

margin-top-15

margin-top-16

margin-top-17

margin-top-18

margin-top-19

margin-top-20

margin-top-21

margin-top-22

margin-top-23

margin-top-24

margin-top-25

margin-bottom-[number]

Corresponding negative bottom margins are available written in the format of margin-bottom-25-negative, margin-bottom-25-negative-before, and margin-bottom-25-negative-after.

margin-bottom-1

margin-bottom-2

margin-bottom-3

margin-bottom-4

margin-bottom-5

margin-bottom-6

margin-bottom-7

margin-bottom-8

margin-bottom-9

margin-bottom-10

margin-bottom-11

margin-bottom-12

margin-bottom-13

margin-bottom-14

margin-bottom-15

margin-bottom-16

margin-bottom-17

margin-bottom-18

margin-bottom-19

margin-bottom-20

margin-bottom-21

margin-bottom-22

margin-bottom-23

margin-bottom-24

margin-bottom-25

margin-left-[number]

Matching pseudo classes for margin-left-[number] :before and :after are available written in the format of margin-left-25-before or margin-left-25-after. Corresponding negative left margins are available written in the format of margin-left-25-negative, plus pseudo classes of margin-left-25-negative-before or margin-left-25-negative-after.

margin-left-1

margin-left-2

margin-left-3

margin-left-4

margin-left-5

margin-left-6

margin-left-7

margin-left-8

margin-left-9

margin-left-10

margin-left-11

margin-left-12

margin-left-13

margin-left-14

margin-left-15

margin-left-16

margin-left-17

margin-left-18

margin-left-19

margin-left-20

margin-left-21

margin-left-22

margin-left-23

margin-left-24

margin-left-25

margin-right-[number]

Matching pseudo classes for margin-right-[number] :before and :after are available written in the format of margin-right-25-before or margin-right-25-after. Corresponding negative right margins are available written in the format of margin-right-25-negative, plus pseudo classes of margin-right-25-negative-before or margin-right-25-negative-after.

margin-right-1

margin-right-2

margin-right-3

margin-right-4

margin-right-5

margin-right-6

margin-right-7

margin-right-8

margin-right-9

margin-right-10

margin-right-11

margin-right-12

margin-right-13

margin-right-14

margin-right-15

margin-right-16

margin-right-17

margin-right-18

margin-right-19

margin-right-20

margin-right-21

margin-right-22

margin-right-23

margin-right-24

margin-right-25