как выровнять текст по центру и справа

Question

Я сталкиваюсь с проблемой при выравнивании двух текстов, один по центру, а другой справаПриходит налево, это не центральное выравнивание должным образом, пожалуйста, скажите, это правильный путь или есть какой-то другой способ справиться с этим сценарием.

Спасибо

Answer 1

Если вы хотите, чтобы элемент не связывался с макетом, попробуйте абсолютное значение:

<div id="header" style="position:relative;text-align:center;"><!-- define relative so child absolute's are based on this elements origin -->
    <div id="sampleLink" style="position:absolute; top:0px; right:0px; >Link</div>
    <h1 style="text-align:center;">Heading</h1>
</div>

Answer 2

Вам не нужно использовать div для этого, вы можете стилизовать сами элементы.Тег по умолчанию не понимает выравнивание текста, так как это встроенный элемент, поэтому я поместил ссылку в абзаце, который принимает выравнивание текста.Я поместил две строки в тег

небольшой ширины, чтобы было легко увидеть, что происходит.

<div style="width:400px;">
  <h1 style="text-align:center"> Sample Heading</h1>
<p  style="text-align:right"><a href="#">sample link</a> </p>
</div>

Answer 3

Это прекрасно работает для меня. Но если у вас есть проблемы с позиционированием h1, попробуйте сделать его заблокированным: h1 { display: block; }. С другой стороны, если вы хотите отобразить h1 и a в одной строке, вам просто нужно поставить a по правому краю перед h1.