I am looking to change the border color to green or any other color. I have already set the border color, but now I want to fill it with a color by using a method similar to the 'Paint Bucket' tool in Photoshop.
$(document).ready(function () {
$('p').each(function (index, el) {
if ($(this).css('marginLeft') === '15px'){
$(this).css({borderLeftStyle: "solid",
borderLeftColor: "green"
})
}
});
});
//Details to update:
//Change ".p" to your desired selector.
//Update CSS property and value accordingly.
//Modify "css()" with your preferred action on that element.
body{
font-family: 'Roboto Condensed', Helvetica, sans-serif; }
.wrap{
display: grid;
grid-template-columns: 100px auto 100px;
grid-template-rows: auto;
}
section{
grid-column-start: 2;
grid-column-end: 3;
}
article{
background-color: #f8f8f8;
}
img{
max-width: 50%;
height: auto;
margin: 10px 5px 10px 5px;
}
time{
font-family: Menlo, Monaco, monospace;
display: block;
color: #beaaae;
letter-spacing: 2px;
text-transform: uppercase;
font-weight: 200;
margin: 0 0 15px 0;}
h2{
margin-bottom: 2px; }
p{
margin-left: 15px;
line-height: 25px; } /*TODO: space between text*/
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE HTML>
<html>
<section>
<article>
<h2>Connect GitHub to the project</h2>
<time class="time">January 11 2018</time>
<p><strong>Notice:</strong> Registration on website <code>https://github.com/</code><br>
Go to the setting of IDE select bookmark <em>GitHub</em> input personal data in given field.<br>
Where's <em>Host</em> it's <code>github.com</code> and <em>password</em> it's password on website/<br>
Then press <em>Test</em> for successful connection to website.
</p>
</article>
</section>
<html>
UPDATE: Instead of margin-editing, consider adding color to this area instead.
Margin indentation This is the space between the left corner and right side. I would like to replace the "margin" with a colored fill in this area.