CSS left Property

In CSS, the left property specifies the horizontal position of a positioned element. It has no effect on elements that are not positioned.

Syntax

left: auto | length | initial | inherit;

Example

<!DOCTYPE html>
<html>
<head>
<style>
    .ex1 {
        position: relative;
        width: 100%;
        height: 200px;
        border: 2px solid #f2f3f5;
    }
    .ex2 {
        position: absolute;
        left: 100px;
        width: 100px;
        height: 100px;
        border: 2px solid #00ab55;
    }
</style>
</head>
<body>

<div class="ex1">
    <div class="ex2">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>
</div>

</body>
</html>

Preview

Property Values

Value	Description
auto	Allows the browser to compute the left edge position. This is the default setting.
length	Sets the left edge position in pixels, centimeters, and so on. Negative values are permitted. Learn more about length units.
%	Sets the position of the left edge in percentage of the containing element. Negative values are permitted.
initial	This property is set to its default value.
inherit	This property is inherited from its parent element.

Supported Browsers

Property	Chrome	Firefox	Safari	Edge / IE	Opera
left	1.0	1.0	1.0	5.5	5.0

@keyframes

letter-spacing

CSS left Property

Syntax

Example

Property Values

Supported Browsers

Links

Tutorials

Connect with us