Ciao,
sto seguendo un corso online di html e css su udemy e sto facendo questo esercizio dove bisogna creare la pagina web di un sito. Mi sono accorto però che riesco ad aprire normalmente la pagina index.html con chrome ma appena aggiorno la pagina crasha (mi appare il messaggio con scritto che il file non è stato trovato). Invece se uso firefox non mi dà problemi. Ho pensato di aver sbagliato qualcosa nel codice inizialmente ma se con firefox non mi dà problemi non capisco cosa sia successo. Vi scrivo la pagina html e css
Ecco il codice della
pagina html
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="description" content="Welcome to the most extraordinary hotel in Boston Massachussets">
<meta name="keywords"content"="hotel,boston hotel, new england hotel">
<link rel="stylesheet" href="style.css">
<title>Hotel BT | Welcome</title>
</head>
<body>
<header>
<nav id="navbar">
<div class="container">
<h1 class="logo"><a href="index.html">HBT</a></h1>
<ul>
<li><a class="current" href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
</nav>
<div id="showcase">
<div class="container">
<div class="showcase-content">
<h1><span class="text-primary">Enjoy</span> your Stay</h1>
<p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<a class "btn" href="about.html">About our Hotel</a>
</div>
</div>
</div>
</header>
</body>
</html>
ed ecco il
css
/*reset*/
* {
margin:0;
padding:0;
box-sizing: border-box;
}
/*Main Styling */
html,body {
font-family: sans-serif;
line-height: 1.7 em;
}
a {
color:#333;
text-decoration: none;
}
h1,h2,h3{
padding-bottom: 20px;
}
p {
margin:10px 0;
}
/*utility class*/
.container {
margin:auto;
max-width: 1100px;
overflow:auto;
padding:0 20px;
}
/*Navbar*/
#navbar {
background: #333;
color: #fff;
overflow:auto;
}
#navbar a {
color:#fff;
}
#navbar h1{
float:left;
padding-top: 20px;
}
#navbar ul {
list-style: none;
float:right;
}
#navbar ul li {
float:left;
}
#navbar ul li a {
display: block;
padding: 20px;
text-align: center;
}
#navbar ul li a:hover,
#navbar ul li a.current {
background: #444;
color: #7c08a;
}
/*showcase */
#showcase {
background: url ('img/showcase.jpg' ) no-repeat
center center/cover;
height:600px;
}
potete spiegarmi cosa ho sbagliato o mitici? grazie