Question:

Can I make a specific character the center point on a header?

Problem:

For example, I have

team1 0-0 team2

Lets say team1 = "David" and team2 = "Bob"

then the center of the page would be

David 0-0 Bob

How do I make it so that the 0-0 is the centered at all times? I do not want to use margins because the team names vary. Also, trying to align items - center produces an uneven header.

I want the header to be read as a single line, not like team1 0-0 team2.

<nav>

<a class="nav-brand miniHeader2">Current Score</a><br>

Hamber <%=selectedMatch.ourScore %>-<%=selectedMatch.theirScore%> <%=selectedMatch.team %>

</a>

</div>

</nav>

</header>

Solution:

Try grouping just the score inside its own inline element like <span>, and use CSS Grid:

Hamber

<span>

<%=selectedMatch.ourScore %>–<%=selectedMatch.theirScore%>

</span>

<%=selectedMatch.team %>

</a>

#headerText {

display: grid;

grid-template-columns: 1fr auto 1fr;

gap: 1ch; /* Optional */

font-variant-numeric: tabular-nums; /* Optional */

}

>grid-template-columns specifies sizes for each column in the grid, the columns being elements or text fragments. Using the 1fr >fractional unit should ensure that both sides have an equal width.
The gap will make sure there's always some space between the team names and the score, just like in your example, even if all the text doesn't fit into the parent container.
As a bonus, the font-variant-numeric property will make each digit have the same width (if the font supports it), so as the score changes, it should stay in one place.

If you're going to be dealing with really long team names, try looking into >CSS text truncation.

>Top 8 programming languages to used in artificial intelligence coding

>How you can pick a language for AI programming

>Supervised Learning vs Unsupervised Learning- Technical Chamber

>How Artificial Intelligence is Transforming the Gaming Industry

>Sorting the restframework in Django

>Ways to access instances of models in view in order to save both forms at once in Django