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.
I actually discovered that instead of displying the code, the browser shows the text, and both links are now working. However, in “codepen.io” editor, the second link does not work.
EDIT. If you’re adding links on codepen, always add the target="_blank" attribute to your links so they always open in a new tab. Codepen doesn’t like having links opened in its preview window.
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
If your second link is correct, then the problem may be network connection. Had the same problem on a link of my tribute project. Problem was solved when I logged out and the logged in. Hope it helps.