Html Question posted in
Some basic documentation can be found here.

Html – Why the (a) tag appeared next to the image not below it?

Why the anchor(a) tag appeared next to the image and not below it? isn’t the page suppose to be read from up to bottom?

<h1>Our Menu</h1>
<h2>Falafel</h2>
<p>Chickpea, herbs and spices.</p>
<img src="flafel.jpeg" width="240" height="135" alt="Flafel">
<h2>Pasta Salad</h2>
<p>Lettuce, vegetables and mozzarella.</p>
<img src="salad.jpg" width="240" height="135" alt="Salad">
<a href="location.html">Our Location</a>

I was trying to practice some html basics but this problem happened and can’t find an explanation for it.

Tags:

2

Answers


  1. 0

    this is because img and anchor "a" tag are both the inline tags.
    to solve this issue you should try wrapping the "img" image tag into a div

    Login or Signup to reply.
  2. 0

    For now, you can use a <br> on the line between the image and text. It would be better to learn CSS and relatively position it below but the
    tag works.

    <!DOCTYPE html>
<html>
    <head>
        <title>Little Lemon</title>
    </head>
    <body>
        <h1>Our Menu</h1>
        <h2>Falafel</h2>
        <p>Chickpea, herbs and spices.</p>
        <img src="flafel.jpeg" width="240" height="135" alt="Flafel">
        <h2>Pasta Salad</h2>
        <p>Lettuce, vegetables and mozzarella.</p>
        <img src="salad.jpg" width="240" height="135" alt="Salad">
        <br>
        <a href="location.html">Our Location</a>
    </body>
</html>

    Also the images in this demonstration cannot be shown because I have no access to that location, but this should work for you.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search