I'm having trouble understanding why the css selector holder2 in my html file, with a fixed position, won't allow me to change its left property. It seems like I can only adjust the top property. If I attempt to modify the value of the left property, the div remains in the same position.
#translucent {
background-color: orange;
opacity: 0.5;
}
.holder2 {
width: 100%;
height: 100%;
position: fixed;
z-index: 2;
border: 3px solid red;
top: 70px;
left: 180x;
}
.holder {
width: 100%;
height: 100%;
position: fixed;
z-index: 2;
border: 3px solid red;
top: 70px;
left: 190px;
}
.frame {
width: 128px;
height: 128px;
}
.bar {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 40px;
border: 3px solid green;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>The opacity Property</h1>
<div class="holder2">
<img style="" src="http://gallery.raccoonfink.com/d/7003-2/alien-head-128x128.png">
<iframe class="frame" id="translucent"></iframe>
<div class="bar" id="2">
</div>
</div>
<div class="holder">
<iframe class="frame" id="translucent"></iframe>
<div class="bar" id="1"></div>
</div>
</body>
</html>