left プロパティ

　left プロパティは、エレメントの左右位置を指定するプロパティです。左端からの位置になります。
　ただし、このプロパティが機能するには position プロパティが static 以外であることが必要です。position プロパティの値によって表示位置の基準が変わります。

左から100pxの位置に配置

left: 100px;

動作の確認はExampleを参照してください

left プロパティについて

　left プロパティはposition プロパティによって基準位置が変わります。

　以下は、position プロパティと表示位置の変化についてです。

positionの値	概要
position:static;	left プロパティは反映されない。
position:absolute;	絶対位置の設定で、基準位置はウィンドウの左端。親エレメント（親要素）にpositon:static;以外が設定されていれば、親エレメントの左端。
position:fixed;	絶対位置の設定でスクロールに影響を受けない。ウィンドウ上の表示位置が固定される。基準位置はウィンドウの左端。
position:relative;	相対位置の設定で、基準位置はデフォルトで表示される位置。
position:sticky;	スクロールに影響を受けるために、left プロパティはposition:sticky;によって位置が固定された時の左右配置。位置が固定されていない間はleft プロパティは影響しない。

　親エレメントに対して配置を設定するには、親エレメントに対して position:relative; を指定し、エレメントに対してはposition:absolute;を指定します。

　この時にエレメントの大きさがデフォルトで100%でも自動で調整されます。エレメントの幅を指定し直す必要があるかもしれません。

/* 親エレメントへの指定 */
parent_element {
		position: relative;
}

/* 調整したいエレメントへの指定 */
element {
		position: absolute;
		width: 100%;
		left: 30px;
}

left: auto | length | % ;

値の取得

object.style.left;

値の設定

object.style.left=" auto | length | % ";

　leftによる位置の例です。親エレメントに position:relative;、エレメントに position:absolute; を指定し、親エレメントを表示位置の基準にしています。