padding-left, margin-left，left以及padding-inline-start都能在一定的情況下起到令元素由左向右位移的效果(靠左距離)。
在這裏padding-left（內邊距）和margin-left （外邊距）可以直接從console裏的box model反映出。給左內邊距padding-left 30像素，左外邊距margin-left 20像素 - 如下圖所示
<html>
<head>
<style>
.body{
padding-left: 30px;
margin-left: 20px;
}
.test{
width: 100px;
height: 100px;
background: slateblue;
}
</style>
</head>
<body>
<div class="body">
<div class="test"></div>
</div>
</body>
</html>
left在一般情況下無法使用。如果對上述的 .body div 裏直接設置left的話，box model不會發生任何改變。但如果對 .body設置絕對定位（position absolute）的話，則會在外邊距以外形成靠左距離。在 .body 裏添加了position：absolute以及left：40px
添加位置與left後的body：
.body{
padding-left: 30px;
margin-left: 20px;
position: absolute;
left: 40px;
}
padding-inline-start的作用取決於inline的方向。如果是由左向右的水平（horizontal）方向，則會overwrite padding-left之前設定的值。假設在之前代碼的基礎上加入padding-inline-start: 50px，box model的左內邊距會由30變成50：
.body{
padding-left: 30px;
margin-left: 20px;
position: absolute;
left: 40px;
padding-inline-start: 50px;
}
在其他情況下，padding-inline-start有可能會起到padding-top，padding-right，或者padding-bottom的作用。這些取決於writing-mode, direction, and text-orientation.
以下是從MDN搬來的事例：
我扳指頭數了數，IE瀏覽器下的關鍵字值多達11個，正好可以組個足球隊，
lr-tb
IE7+瀏覽器支持。初始值。內容從左往右(left-right)，從上往下(top-bottom)水平流動，以及下一行水平元素在上一行元素的下面，所有符號都是直立定位。大部分的書寫系統都是使用這種佈局。
rl-tb
IE7+瀏覽器支持。內容從右往左(right-left，從上往下(top-bottom)水平流動，以及下一行水平元素在上一行元素的下面，所有符號都是直立定位。這種佈局適合從右往左書寫的語言，例如阿拉伯語，希伯來語，塔安那文，和敘利亞語。
tb-rl
IE7+瀏覽器支持。內容從上往下(top-bottom)，從右往左(right-left)垂直流動， 下一個垂直行定位於前一個垂直行的左邊，全角符號直立定位，非全角符號(也可以被稱作窄拉丁文或者窄假名符號)順時針方向旋轉90°。這種佈局多見於東亞排版。
bt-rl
IE7+瀏覽器支持。內容從下往上(bottom-top)，從右往左(right-left)垂直流動， 下一個垂直行定位於前一個垂直行的左邊，全角符號直立定位，非全角符號(也可以被稱作窄拉丁文或者窄假名符號)順時針方向旋轉90°。此佈局多見於在東亞垂直排版從右往左的文本塊上。
tb-lr
IE8+瀏覽器支持。 內容從上往下(top-bottom)，從左往右(left-right)垂直流動。下一個垂直行在前一個的右邊。
bt-lr
IE8+瀏覽器支持。 內容從下往上(bottom-top)，從左往右(left-right)垂直流動。
lr-bt
IE8+瀏覽器支持。 內容從下往上(bottom-top)，從左往右(left-right)水平流動。下一個水平行在前一行的上面。
rl-bt
IE8+瀏覽器支持。內容從下往上(bottom-top)， 從右往左(right-left)水平流動。
lr
IE9+瀏覽器支持。在SVG和HTML元素上使用。等同於lr-tb.
rl
IE9+瀏覽器支持。在SVG和HTML元素上使用。等同於rl-tb.
tb
IE9+瀏覽器支持。在SVG和HTML元素上使用。等同於tb-rl.
各個屬性值的表現如下（form微軟官網）
CSS direction 屬性
div
{
direction: rtl
}
ltr 默認。文本方向從左到右。
rtl 文本方向從右到左。
inherit 規定應該從父元素繼承 direction 屬性的值。