Как я могу контролировать высоту границы?

Question

Это мой пример:

https://jsfiddle.net/aww9vej4/

HTML:

<div> 
    <p>In the current art market, competition plays such a crucial role that collectors rely on advisors to help them build their collections and acquire significant artworks. Advisors are the eyes and ears of their clients, closely monitoring and analyzing art market developments. Considering that only 5% of all transactions take place at auction houses worldwide, it is the task of the advisor to look beyond such a limited part of the market.Therefore, an art advisor is always aware of international gallery programs, visits museums, artist studios,and non-profit organizations worldwide, researching artists, movements, and new trends. All of this is to give collectors a decisive lead and a better understanding of their purchases, hopefully ahead of others.</p> 
</div> 

CSS:

div{background:red;} 
p{border-left:5px solid blue} 

Я положил границу, ее высота слишком высока. Я хочу быть примерно половиной того, что сейчас. Как мне это сделать?

Answer 1

Вы не можете установить длину или высоту границы, использовать псевдо-элемент вместо:

div{background:red;} 
 
p{position:relative;} 
 
p:after{ 
 
    content:''; 
 
    position:absolute; 
 
    left:-5px; 
 
    height:50%; 
 
    width:5px; 
 
    background:blue; 
 
    top:25%; 
 
    }

<div> 
 
    <p>In the current art market, competition plays such a crucial role that collectors rely on advisors to help them build their collections and acquire significant artworks. Advisors are the eyes and ears of their clients, closely monitoring and analyzing art market developments. Considering that only 5% of all transactions take place at auction houses worldwide, it is the task of the advisor to look beyond such a limited part of the market.Therefore, an art advisor is always aware of international gallery programs, visits museums, artist studios,and non-profit organizations worldwide, researching artists, movements, and new trends. All of this is to give collectors a decisive lead and a better understanding of their purchases, hopefully ahead of others.</p> 
 
</div>

Границы всегда имеют высоту или длину стороны они размещены.

Answer 2

div{ 
 
    background:red; 
 
} 
 
p{ 
 
    position: relative; 
 
    padding-left: 10px; 
 
} 
 
p:before{ 
 
    content: ''; 
 
    position: absolute; top: 50%; left: -5px; 
 
    height: 50%; 
 
    width: 5px; 
 
    background: #00f; 
 
    -webkit-transform: translate(0%,-50%); 
 
    -ms-transform: translate(0%,-50%); 
 
     transform: translate(0%,-50%); 
 
}

<div> 
 
    <p>In the current art market, competition plays such a crucial role that collectors rely on advisors to help them build their collections and acquire significant artworks. Advisors are the eyes and ears of their clients, closely monitoring and analyzing art market developments. Considering that only 5% of all transactions take place at auction houses worldwide, it is the task of the advisor to look beyond such a limited part of the market.Therefore, an art advisor is always aware of international gallery programs, visits museums, artist studios,and non-profit organizations worldwide, researching artists, movements, and new trends. All of this is to give collectors a decisive lead and a better understanding of their purchases, hopefully ahead of others.</p> 
 
</div>