CODEWITHSUNDEEP
htmlcss
Sarah Diri
Sarah Diri

Reputation: 97

My HTML file won't link to other HTML files or CSS

I am using Sublime text to write some HTML and CSS files. I've created my index.html:

<!DOCTYPE html>
<html lang="en">
<head>

  <!--  Meta  -->
  <meta charset="UTF-8" />
  <title>RainyDayBakes</title>

  <!--  Styles  -->
  <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>



  <h1 style="text-align:center">RainyDayBakes</h1>
  <nav style="text-align:center">
    <a href=”C:\Users\sarah\Documents\Simmons\CS-321\page1.html”> About </a>
    <a href=”page2.html”> Menu </a>
    <a href=”page3.html”> Gallery </a>
    <a href=”page4.html”> Order </a>
    <a href=”page5.html”> Contact Us </a>
  </nav>

  <img src="cake.png" alt="oreo crumble cake" class="center">

  <h3>Welcome to RainyDayBakes!</h3>
  <p>We are a local bakery specializing in creative cakes, cupcakes and cookies!</p>
  <p>In addition to being open daily we also offer custom ordered confections.</p>

  <!-- Scripts -->
  <script src="scripts/index.js"></script>
</body>

<footer>
</footer>
</html>

my page1.html:

<!DOCTYPE html>
<html>
  <head>

    <meta charset="UTF-8" />
    <title>This is Page One </title>

  </head>
  <body>
  </body>
  <footer>
  </footer>
</html>

and my style.css:

<style>
    h1 {
        color:red;
    }
</style>

When I try to run index.html in Chrome, the link to page1.html says it doesn't exist, and the CSS won't show up. They're all in the same folder, I've saved all the files, and I'm running on Chrome. Every other solution I've found refers to making a typo, the directories being different, etc. but as said, they're all in the same folder, and I haven't noticed a typo (but it's entirely possible when you're too close to your code).

Upvotes: 0

Views: 3230

Answers (6)

Marcus Myles
Marcus Myles

Reputation: 1

This isn't an issue with your code. I was having the same exact problem too and i recently discovered that the problem likely lies in the IDE that you're using. I was using stackblitz and recived the same output. But when i switched to an online compiler and litteraly copy & pasted the code with the same file names, the code started working correctly. Try using an online compiler and see how that works out for you. It worked for me.

The compiler I used is: https://www.onlinegdb.com/

make sure to switch the languate to HTML using the language dropdown on the top right corner.

Upvotes: 0

msh
msh

Reputation: 1

So you have two issues:

  1. For page1.html, would suggest adding file:// or file:/// to the beginning of the href element, or maybe retyping the line since the other links worked
  2. For your CSS, remove the tag, it's for when you put the style inside the HTML file(embedded)

Upvotes: 0

Johannes
Johannes

Reputation: 67748

You are using typographical quotes in your links' href attributes, which won't work. Change those to regular quotes.

Upvotes: 1

Kevin S
Kevin S

Reputation: 53

You might want to put a link to your CSS file on all your pages, I don't see it on your page1.html You probably already know about this resource but I mention it just in case you don't: W3 Schools is very handy for a quick reference to a lot of HTML/CSS questions.

Upvotes: 0

Jesse Jim
Jesse Jim

Reputation: 1

Let the link be this way instead href=”page1.html”

Upvotes: 0

SirValex
SirValex

Reputation: 11

First off, you're not even using the tag anywhere in your code, so that's why the style isn't showing up. Secondly, if they are in the same folder, just link your about page to page1.html; not the full directory listings.

Upvotes: 1

Related Questions