Как контролировать место div и svg

Question

div {
     text-align:justify;
     color: white;
     font-size:14px;
     font-family: 'Muli', sans-serif;
     border-style: solid;
     border-color:red;
     height:60px;
     width:230px;
     display:inline-block;
     margin-top:10px;
     margin-left:10px;
     padding-top:0px;
     }

<svg height="50" width="200">
  <line x1="50" y1="20" x2="200" y2="20" style="stroke:rgb(255,255,255);stroke-width:2.5"/>
</svg>
<div>Modern architecture first took off in Europe and then made its way into the American style.</div>

У меня проблема с SVG и div. У меня есть div (поле с текстом) рядом со строкой SVG. Проблема в том, что когда я добавляю div, SVG линия сверху будет go к месту в центре div. Я хочу, чтобы SVG был точно в нижней части заглавной буквы A в слове Архитектура. помощь!