Drawing with CSS or php

i assume u can do with jquery instead

like
#dot{
border-bottom:1px dashed #ffffff;
}

jquery
$document.ready(function(){
 var headingwidth=$('#heading').width();//#heading is id assign to heading in css
$('#dot').css("width":headingwidth+"px");
});

You don’t need PHP or jQuery for this, that is overkill. Edit your CSS file and add one line.

https://igmosi.com/blog/wp-content/themes/autofocus/style.css (around line 165):

#content.index .post .entry-content {
color: #888888;
float: left;
font-size: 1.2em;
padding: 0 10px 3em 0;
width: 590px;
border-bottom: dotted 1px #000; /* <– new line */
}

Thank you very much!! It worked perfectly!!

But there is so much empty space between the content and line as well as between the picture and the content. How can I make it smaller??

Not sure which one of us you are talking to. But, the extra space at the bottom of the content is caused by the 3em of padding. You could change that to maybe 1em, as follows:

#content.index .post .entry-content {
color: #888888;
float: left;
font-size: 1.2em;
padding: 0 10px 1em 0;
width: 590px;
border-bottom: dotted 1px #000;
}

Thanks!!

Why that line-points dont appear using Chrome??

Because there is no such thing as 0.5px. The smallest possible value is 1px.

Thank you very much!!!!!

One more thing…making this changes, I made some mistake and now, the link to go “older post” at bottom of the page, it appears in the post’s date instead of the bottom of the pages…

where is its code?? I am going crazy! ??

Thank you very much!!