Can someone help me with a coding issue I'm facing on my website? I am trying to create three vertical lines to separate images in columns, but every time I exit the editor and preview the site, the position of the lines changes. I'm new to HTML and CSS so I'm not sure if I've missed something or made a mistake.
div#left {
background-color: clear;
width: 50%;
height: 70%;
float: left;
border-left: 1px solid black;
top: 275px;
margin-left: 400px;
position: absolute;
}
div#leftt {
background-color: clear;
width: 50%;
height: 70%;
float: left;
border-left: 1px solid black;
top: 275px;
margin-left: -10px;
position: absolute;
}
div#right {
background-color: clear;
width: 50%;
height: 70%;
float: left;
border-left: 1px solid black;
top: 275px;
margin-left: 810px;
position: absolute;
}
<div id="container" style="background-color: clear; width: 100%; height: 80%;">
<div id="left">
</div>
<div id="leftt">
</div>
<div id="right">
</div>
</div>