I would be grateful if someone can explain to me what mistake I make in this piece of code, because I can easily open the first link in the same tab, whereas the second only opens if I open it in a new tab (but not if click it):
<p> If you are interested in finding more information on Perotin and his musical legacy, you may access this <a href="https://en.wikipedia.org/wiki/P%C3%A9rotin"> Wikipedia entry, </a> whereas for a fairly impressive discography, you may access this <a href="http://www.medieval.org/emfaq/composers/perotin.html"> link. </a> </p>
I am a beginner and I appreciate very much any useful input.
There shouldn’t be a <body> tag in your code. The entire HTML section in codepen already represents the contents of the <body> element. And stuff like <h1>, <div>, <img>, etc. (things that appear on the webpage) should always be inside <body>.
The empty <p> elements don’t do anything, so you can remove them. On the other hand, those big chunks of text should be enclosed in <p> tags (remember that p stands for paragraph).
The use of <i> I think is perfect
I think using <figure> is unnecessary. Better yet, add a <figcaption> to describe what the image is about.
apologize for replying late and many thanks for your very valuable comments and information.
I tried using css to align the image but it continued to remain in the left, I only managed to have it centered by using the “align” attribute. This was also the reason for which I used the “figure” tag, because I assumed I may do something wrong. Following your suggestion I tried again with css and it seems that it now works. I did not feel the need to add a caption because the figure is not directly related to Perotin, but is only intended to create a visual feeling of the epoch Perotin lived in. The empty <p> are intended to provide some empty space between paragraphs (this is the solution I found recommended on searching for how to insert blanks; I am not sure that it works, if you can suggest a more orthodox way of inserting empty lines (between the heading and the text paragraph) I would be grateful). Yes, you are right that I should have included all big chunks of text in <p> tags, I simply forgot to do it.
Thanks, Kev, I’ve done those. Now my question is: for the italicized subtitle (“The unknown master”) I have used an h2 tag, as well as for the other sub-headings (e.g. “Who was Master Perotin?”). I only want the italicized subtitle centered, no the others. If I use CSS h2 for this, it would be applied uniformly. How should I proceed to have different alignments? (I assume I should have one of the h3, but I am not sure which of them and if that is the best option). Can you make a suggestion (apologies for extracting too much from you). As for being formal, I think it is just because I am too old