JSFiddle - React, Tailwind, and code Playground

HTML

<div class="block">
  <span class="block-align">
    <span class="block-inner">система дифференциальных уравнений</span>
  </span>
</div>

CSS

.block{
  display: flex;
  align-items: center;
  justify-content: center;
	background: #fff;
	border: 2px solid #333;
	border-radius: 5px;
	padding: 15px;
  font-family: monospace;
  font-size: 2em
}
.block-align{
    margin-left: 30px;
    display: block;
}
.block-inner{
	position: relative;
}
.block-inner:before{
    color: #B5B5B5;
    content: '★';
    position: absolute;
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 10px;
    font-size: 1.2em;
}

JavaScript

var $block = $('.block');
  
  $(window).resize(function(){
		$block.find('.block-align').each(function(i ,el){
			$(el).css('padding-left', 0)
			
			var padding = el.offsetWidth - el.firstElementChild.offsetWidth;
			
				$(el).css('padding-left', padding > 0 ? padding / 2 : 0)
		})
		
	}).resize();