New course! Every coder should learn Generative AI!
Try a free lesson0
Why does (in given example) the second text isn't align to centre
6 Answers
+ 2
And the ( exact/complete ) explanation of why the unexpected <hr> inside <p> broke the layout and produce unexpected result, is that browsers try ( and succeed almost the time ) to correct invalid html pages... So in html5 semantical logic, encountering an <hr> will be interpreted as if it was a missed </p> ending, and obviously so, a missed <p> starting tag before and after the <hr>, splitting the <p> in two, and as the second lose its styling attributes, it's default left aligned ;)
+ 1
It looks as though the <hr /> causes the second text to ignore the align command as if it's splitting the <p> tag in a way... So you probably need to make 2 <p> tags (one for each text line).
WHY this occurs is what I'm wondering as well...
+ 1
The <hr> tag defines a thematic break/change in an html content... so it's unexpected as unlogigal inside a paragraphe, which is semantically defined as an independent content unit ^^
You can do instead:
<style>
.center {
text-align:center;
}
.hline {
display:inline-block;
width:10%;
margin-left:90%;
border-bottom:3px solid royalblue;
}
</style>
<body>
<p class="center">This is a text <br>
<span class="hline"></span> This is second text
</p>
</body>
( accessory Html doesn't require slash char ( / ) at end of <hr> <br> and so on -- supported but not valid -- and a lot of attributes from tags are now deprecated: we must use css as soon as we can do it with them )
0
Could you give the example? (I don't see any)
0
<body>
<p align="center">This is a text <br />
<hr width="10%" align="right" /> This is second text
</p>
</body>
0
shouldn't the second text align to centre also?
Often have questions like this?
Learn more efficiently, for free:
Hot today
Python Question
3 Votes
How to learn fast C?
0 Votes
Initials of name
1 Votes
Python Core - restarting?
1 Votes
Forever loop pls help
0 Votes
Css In python
0 Votes