divers circle

**Barry360** · Nov 6, 2011 21:32

I've just made my way to page 48 of the book so far so good.
Tried to add the image divers-circle not showing I have a folder on the desk top
called web-work I insde this I have my index.html I then have an images folder in here
with the divers circle image inside. Does that sound OK?
Thanks,
Barry

**ralph.m** · Nov 6, 2011 21:33

Hi Barry360. Welcome to SitePoint.

Which book?

**Barry360** · Nov 6, 2011 21:38

Hi Ralph,
Build your Own
Web Site The Right Way
using HTML & CSS

By Ian LLOYD

**ralph.m** · Nov 6, 2011 21:41

OK, yep, that sounds OK, but it will only work if the link paths are set correctly. Can you post the relevant HTML you have?

**Barry360** · Nov 6, 2011 21:45

Do you mean all the code I've written so far? How do I go about that?

**ralph.m** · Nov 6, 2011 21:52

Perhaps for starters just post code of the link. You can just copy code and paste it here as part of your answer (and preferably place code [ code ] tags around it—but without the gaps).

Anyhow, what you presumably have is

Code:

<p><img src="divers-circle.jpg" ... </p>

If the image isn't showing, it means the path to the file is wrong. If the image is in an /images/ folder insider your main folder (and the page itself is in the main folder) the link above would need to look like

Code:

<p><img src="images/divers-circle.jpg" ... </p>

The red bit above tells the browser where to find the image. It's in the folder called /images/. But you have to spell that name exactly, including captials, for it to work. So if you folder is called /Images/, that link above won't work. You have to be very precise about this—so ideally follow the book to the letter to begin with to avoid pitfalls.

**Barry360** · Nov 6, 2011 21:56

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http:www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
>html xm1ns="http://www.w3.org/1999/xhtml">
 <head>
   <title>Bubble Under - The diving club for the south-west UK</title>
   <meta http-equiv="Content-Type"
      content="text/html; charset=utf-8" />
 </head>
 <body>
   <h1>BubbleUnder.com</h1>
   <p>Diving club for the south-west UK - Let's make a splash</p>
   <h2>Welcome to our super-dooper Scuba site</h2>
   <p><img src="divers-circle.jpeg" width="200" height="162"
       alt="A circle of divers practice their skills" ?></p> 
   <p>Glad you could drop in and share some air with us! You've
       passed your underwater navigation skills and successfully
       found your way to the start point - or in this case, our
       home page.</p>
   <h3>About Us</h3>
   <p>Bubble Under is a group of diving enthusiasts based in 
      the south-west UK who meet up for diving trips in the summer months when the weather is good and the bacon rolls are 
      flowing. We arrange weekends away as small groups to cut the 
      costs of accommodation and travel and to ensure that everyone 
      gets a trustworthy dive buddy.</p>
   <p>Although we're based in the south-west, we don't stay on our
      own turf: past diving weekends away have included trips up to 
      Scapa Flow in Scotland and to Malta's numerous wreck
      sites.</p>
   <p>When we're not diving, we often meet up in a local pub 
      to talk about our recent adventures (any excuse, eh?).</p>
   <h3>Contact Us</h3>
   <p>To find out more, contact Club Secretary Bob Dobalina
      on 1234 56789 or <a
      href="mailto:test@test.com.">email
      test@test.com</a>.</p>   
 </body>
</html>

**ralph.m** · Nov 6, 2011 21:59

Yeah, you need to include the images folder in the link. If my tip above isn't right, change the red word to the actual name of the images folder—whatever you've called it. If that doesn't help, tell us the ame of the images folder and I'll show you what the link needs to look like.

**Barry360** · Nov 6, 2011 21:59

My folder say's images all lower case

**ralph.m** · Nov 6, 2011 22:00

OK, so alter the link to what I've shown above and the image will show.

**Barry360** · Nov 6, 2011 22:05

Hi Ralph,
Yes, did it but still does not show?

Code:

<p><img src="images/divers-circle.jpeg" width="200" height="162"
       alt="A circle of divers practice their skills" ?></p>

**ralph.m** · Nov 6, 2011 22:11

OK, check other things then. In the book, the file is called

Code:

divers-circle.jpg

while yours is

Code:

divers-circle.jpeg

Like I say, no differences allowed.

[You've gotta have eagle-eyes in this game.]

EDIT: speaking of which, there is an errant ? in your code too:

Code:

<p><img src="images/divers-circle.jpeg" width="200" height="162"
       alt="A circle of divers practice their skills" ?></p>

Remove that question mark, as it could cause damage.

EDIT2: O, I see, it's a mistyped /. Change it to that.

**Barry360** · Nov 6, 2011 22:16

Thanks Ralph, I can see it now. Great!
Thanks for getting me back on track so fast.
Barry

**ralph.m** · Nov 6, 2011 22:21

No worries, Barry! Good luck with the book, and feel free to ask lots of questions. We enjoy answering them.

User Tag List

Thread: divers circle

Thread Tools

Display

divers circle

Bookmarks

Bookmarks

Posting Permissions