Dear Roblox, Padding is not the same as Margin

All the UILayout Objects has a property called “Padding” in them, it is incorrectly named. What the Engine calls Padding is actually Margin.

I was creating some UI and took me more than an hour to find the margin property, only to be called padding. With all the UI Designers and Web Developers in Roblox, why does this issue still persist and unaddressed?

UILayoutObjects: UIGridLayout, UIInlineLayout, UIListLayout, UIPageLayout, UITableLayout. All call padding as margins.

In case you didn’t know what the difference is:

This is called the CSS Box Model:
Asset 1
It refers to how objects are positioned in reference to the Border.


Asset 2
This is an example of 4 objects that has a MARGIN in them, notice how the thick borders has empty space between the other objects


Asset 3
An image without the padding and margin lines.


Asset 4
This what happens when there is no margin between the objects.


Asset 5
This is an example of padding, the peach box is the content.

  1. This is with 0 padding
  2. 20px padding
  3. 10px padding

Seriously, please, Roblox, change the name to the actual industry used name: margin. I bet there were people like me that spent ages trying to figure out how to add margins.

8 Likes