Hopefully, my description of a "nested div" was accurate.
My current situation involves an image within a div structured like this:
content -> content-inner -> column_left
I'm struggling to start the image at 0 px (the extreme left side of the screen). It seems like I'm confined by the margin settings of the div.
The divs are defined as follows according to Chrome Inspector:
https://i.sstatic.net/4Easp.png
#content {
position: relative;
left: 0px;
top: 0px;
z-index: 2;
width: 100%;
min-width: 280px;
max-width: 980px;
margin-left: auto;
margin-right: auto;
padding-top: 0px;
padding-bottom: 0px;
}
#content-inner {
margin-left: 20px;
margin-right: 20px;
background-color: #FFF;
}
.column_left {
position: relative;
left: 0px;
top: 0px;
width: 65%;
margin-right: 5%;
float: left;
}
I attempted to introduce a new div with the following properties:
.inlineimage
{
float: left;
margin-left: 0px;
margin-right: 20px;
margin-bottom: 5px;
margin-top: 3px;
}
Subsequently, I applied it to the image inside the "column-left" div:
<div class="inlineimage">
<img src="images/myimage.jpg" alt="" />
</div>
Nonetheless, the image remains aligned with the border of the column (approximately 105 px).
Is there a way for me to position the image flush against the 0 px margin from the left edge of the page?
Your assistance is greatly appreciated.