CSS "Left" Not Working

css left not working

You need to set position to absolute or relative:

#inner {
   width: 400px;
   height: 300px;
   background-color: #090;
   position: absolute;
   left: 50%;
}

Position:absolute; left property not working correctly

To make the issue more clear here is the minimal code that illustrate the difference:

.parent {
  position: relative;
  background-color: chocolate;
}

.child {
  position: absolute;
  background-color: darkgreen;
  left: 50%;
}

<a href="" class="parent">
      I am a Parent
      <div class="child">
        I am a child
      </div>
    </a>
<br><br><br><br><br>
<a href="" class="parent">
  <div>I am a Parent</div>
  <div class="child">
    I am a child
  </div>
</a>

Top and Left property not working! Why?

You have colons after left instead of semi-colons

#firstdiv {
    border: 2px solid red;
    position: absolute;
    top:15px; 
    left:25px;
} 
#seconddiv {
    border: 2px solid green; 
    position: absolute; 
    top:65px; 
    left:5px;
}

css image left not working

It's working absolutely fine. By default div's will be rendered as block, so the second image will be positioned on the next line and 30px away from the left.

Explanation for the issue:

#index_content {  position: absolute;  top: 200px;}#new_index_body_slide_image_2 {  position: absolute;  left: 30px; //not working}img {  border: 1px solid red;}

<div id="body" style="height:600px">  <div id="index_content">    <div id="index_content_slide">      <div id="new_index_body_slide_image_1">        <img src="http://i.imgur.com/8MqehqH.png">      </div>      <div id="new_index_body_slide_image_2">        <img src="http://i.imgur.com/pNgIqxQ.png">      </div>    </div>    <button onclick="test()">Click me</button>  </div></div>

CSS bottom, top, right, left element not working

add a property as position:absolute to the same class

.home__scroll{color: var(--first-color);
right: -1.5rem;
bottom: 11rem;
display: grid;
row-gap: 2.25rem;
justify-items: center;
position: absolute;}