My img tag in not working

HTML-CSS
#1

// My image is not showing on my web page.

<main id="main">
  <h1>My Coding Journey </h1>
  <p id="title">My road to becoming a web designer</p>
  <div id="img-div">
    <figure>
    <img id="image" src="https://res.cloudinary.com/dg1hibyti/
              image/upload/v1613222976/logo_ewcprj.jpg">
         <figcaption></figcaption>
    </figure>
  </div>
 </main>type or paste code here
#2

Hi,

Add:

width="...." height="...."

and check again!

#3

The URL for your image has a line break. It’s seeing a new line so the URL is not being read correctly.

Take away the break from this
src="https://res.cloudinary.com/dg1hibyti/ image/upload/v1613222976/logo_ewcprj.jpg">
and you’ll see the image.

#4

Don’t you think that the line break is due to wrapping functionality that each text editor provides?

#5

With that many spaces? No.
Plus I copied it, took out the new line and was able to see the image.

1 Like
#6

Wrapping shouldn’t insert line breaks.

But unless you really need it (like on very small screens) I wouldn’t suggest using wrapping in code editors. You should instead abide by a line length rule (like 80 characters) and either let an auto formatter (Prettier/ESLint) handle it or do it yourself.

#7 
<main id="main">
  <h1>My Coding Journey </h1>
  <p id="title">My road to becoming a web designer</p>
  <div id="img-div">
    <figure>
      
    <img id="image"src="https://res.cloudinary.com/dg1hibyti/image/upload/v1613222976/logo_ewcprj.jpg">
        
      <figcaption></figcaption>
    </figure>
  </div>
 </main>type or paste code here`
#8

Do you have a question @jsuccess?

You should see your very large image now.