404
When i try access the links in the navbar, it gives error despite those links showing up when using a command in console to find other pages. when i click on the other pages through console, it still gives error
404 for http://codingsoapy.42web.io/script.js
404 for menu RSS http://codingsoapy.42web.io/rss.html
hash
img 
src
in addition to the above, remember to always do this:
Clear the browser cache by pressing a few times Ctrl + F5 while viewing your website.
If that doesn’t help (because some browsers are stubborn) then follow these instructions
I think i fixed the space issue, but im still dont understand why the other pages dont work,
Thanks for your help
It’s quite simple: the URLs on your web page reference files that don’t exist. The “RSS Feed” link refers to a file rss.html, but there is no file rss.html on your website. Same with the script.js file being used.
If the website works on your own computer, please make sure those files are uploaded too.
Just checked on another browser, looks like its the cache problem, thanks again for your help!
What worries me is that the hash doesn’t pass (pro.html → bs…JS)
It may mean that someone hacked cdn.jsdelivr.net and modified it
or someone messed up the integrity=sha384 values ​​somewhere
@SashaG use this code instead of the existing one as soon as possible
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
done thanks
you deleted css and put JS instead 
You should have left the JS at the bottom, just change the code
and put this css up in the head
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin=" anonymous">
here is the code for the entire index.html
and you add CSS and JS code also in pro.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Soapy's Cave</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin=" anonymous">
<link rel="stylesheet" href="style.css">
<style>
/* Common styling for all corner divs */
.corner-div {
position: fixed; /* Fixed position for each div */
left: 0; /* Align to the left */
bottom: 0; /* Align to the bottom */
transform-origin: bottom left; /* Scale from the bottom left */
border-radius: 10px; /* Rounded corners */
opacity: 0.8; /* Optional: for layering transparency */
}
/* Different sizes for each div */
.scale-1 {
width: 200px;
height: 200px;
background-color: #62ff00; /* Color for scale 2 */
margin-bottom: 10px; /* Space between divs */
margin-left: 10px; /* Space to the left */
}
.scale-2 {
width: 300px;
height: 300px;
background-color: #41f755 ; /* Color for scale 2 */
margin-bottom: 10px; /* Space between divs */
margin-left: 10px; /* Space to the left */
}
.scale-3 {
width: 400px;
height: 400px;
background-color: #20efaa; /* Color for scale 3 */
margin-bottom: 10px; /* Space between divs */
margin-left: 10px; /* Space to the left */
}
.scale-4 {
width: 500px;
height: 500px;
background-color: #00e7ff ; /* Color for scale 4 */
margin-bottom: 10px; /* Space between divs */
margin-left: 10px; /* Space to the left */
}
</style>
</head>
<body style="background-color: #7DE2D1;">
<!-- Navbar -->
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="container-fluid">
<a class="navbar-brand" href="/index.html">Home</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarText"
aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarText">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="pro.html">Project Gallery</a>
</li>
</ul>
<span class="nav-item">
<a class="nav-link" href="rss.xml">RSS Feed</a>
</span>
</div>
</div>
</nav>
<!-- Main Content -->
<div style="margin-top: 50px; background-color: #CEF9F2; padding: 20px; border-radius: 15px; width: 80%; max-width: 600px; margin: auto; z-index: 5;">
<h1>Hi, I'm Soapy</h1>
<h2>Passionate About Electronics & Programming (:</h2>
</div>
<!-- Corner Divs -->
<div class="corner-div scale-1" style="z-index: 4;"></div>
<div class="corner-div scale-2" style="z-index: 3;"></div>
<div class="corner-div scale-3" style="z-index: 2;"></div>
<div class="corner-div scale-4" style="z-index: 1;"></div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
</body>
</html>
to repeat
wherever you have a call for the bootstrap 5.3.2 .js version, delete it and put the code I gave you for the 5.3.3 js version
(put it at the bottom before you have a closed </body>)
and put the bootstap.5.3.3.blahblah…min.css calls above in <head>