I just got another assignment for web design. And I was curios how to space text like this.
The issue here is not the heading nor the text on the left. I have problem with the time on the right. We are forbidden to edit html which looks like this:
<div class="oteviracka">
<h2>Otevírací doba</h2>
<p><strong>Po – Pá:</strong> 11:00 – 23:00</p>
<p><strong>So:</strong> 11:00 – 24:00</p>
<p><strong>So:</strong> 11:00 – 22:00</p>
</div>
I tried almost everything but the code was always “dirty” and I doubt it is done by the way I did it. (First-child spacing and so).
So my question is How to space text like using tab with CSS?
Use the rule
display: inline-blockon thestrongelements. This rule is combination of inline but with the ability to specify a size:DEMO
Further reading: