Witam
Jestem nowicjuszem podczas tworzenia swojej pierwszej strony internetowej napotkałem problem.Do głównej strony chciałem stworzyć dodatkowe podstrony do których będzie można przejść z głównej strony linkiem.Tu napotkałem problem ponieważ link nie działa jak powinien .Po najechaniu na diva z linkiem w lewym dolnym rogu przeglądarki nie wyświetla się komunikat z linkiem a po kliknięciu nie przenosi na podstronę
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>piękne miejsca</title>
<meta name="description" content="piękne miejsca" />
<meta name="keywords" content="miejsca " />
<meta http-equiv=" X-UA-Compatible" content="IE=edge,chrome=1" />
<link rel="stylesheet" href="style.css" type="text/css" />
<link href="https://fonts.googleapis.com/css?family=Livvic|Oswald&display=swap" rel="stylesheet">
</head>
<body>
<div class="wrap">
<header>
<h1>Piękne Miejsca</h1>
</header>
<div class="content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vehicula magna id magna ornare, quis luctus velit maximus. Proin euismod elit a molestie feugiat. Suspendisse eu luctus augue. Morbi et urna mattis, aliquet tellus eu, efficitur lectus. Aliquam erat volutpat. Morbi tincidunt cursus elit, vitae pharetra ipsum malesuada et. Nunc varius tempor tellus in finibus. Praesent vehicula erat in sem gravida tempor. Quisque sodales nulla nec purus malesuada, sit amet hendrerit orci vestibulum. Donec iaculis efficitur venenatis. Morbi ipsum augue, tristique egestas dapibus et, vestibulum a mi.
Vestibulum id lectus et eros lobortis blandit. Sed aliquam eget nibh vitae sollicitudin. Fusce dignissim, velit non imperdiet dignissim, neque est interdum urna, eu mattis turpis est vel ligula. Nunc vel turpis sit amet erat porttitor luctus. Nam molestie nulla et luctus varius. Aenean vitae facilisis erat, ut bibendum orci. Donec quis nibh sit amet felis aliquet interdum ac in urna. Cras auctor sagittis leo a sagittis. Maecenas tempor vestibulum metus a ultricies. Aenean interdum id nulla et auctor.
Etiam a augue ornare, sollicitudin metus ut, scelerisque libero. Proin hendrerit aliquet congue. Aliquam venenatis porttitor nisi vitae feugiat. Morbi finibus hendrerit metus, in facilisis dui ullamcorper in. Vestibulum ut sapien auctor, congue nisi dictum, iaculis lectus. Nullam fermentum libero vel nunc ullamcorper, nec euismod mauris auctor. Pellentesque id nisi mi. Nulla ullamcorper nec tortor malesuada feugiat. Donec quis egestas leo. Integer sit amet purus efficitur, varius nisi sed, aliquam lacus.
Duis at accumsan dui, at finibus mauris. Quisque a nunc sit amet nunc maximus semper. Integer pharetra non mauris a condimentum. Pellentesque eu tellus dui. Donec eget mattis sapien. Aliquam in arcu consequat, venenatis metus at, congue est. Nullam laoreet et erat at ultrices. Morbi vitae nisi tincidunt, vulputate purus quis, molestie odio. Suspendisse potenti. Maecenas quis posuere dolor. Aliquam fermentum, metus id mollis luctus, dui nunc commodo arcu, a convallis leo nulla non quam. Etiam quis lorem pretium, sagittis massa vel, placerat massa. Sed ut semper tellus, et finibus metus. Proin efficitur scelerisque volutpat. Fusce suscipit, lorem sit amet posuere commodo, ante eros rhoncus risus, vitae consequat mauris arcu ut est.</p>
</div>
<div class="menu">
<div class="inmenu1">
<a href="projekty/projekt1.html" target="_blank"class="link"></a>
Projekt 1</div>
<div class="inmenu2">
<a href="projekty/projektb.html" target="_blank"class="link"></a>
Projekt 2</div>
<div class="inmenu3">
<a href="projekty/projekt3.html" target="_blank"class="link"></a>
Projekt 3</div>
<div class="inmenu4">
<a href="projekty/projekt4.html" target="_blank"class="link"></a>
Projekt 4</div>
<div class="inmenu5">
<a href="projekty/projekt5.html" target="_blank"class="link"></a>
Projekt 5</div>
<div class="inmenu6">
<a href="projekty/projekt6.html" target="_blank"class="link"></a>
Projekt 6</div>
<div class="inmenu7">
<a href="projekty/projekt7.html" target="_blank"class="link"></a>
Projekt 7</div>
<div class="inmenu8">
<a href="projekty/projekt8.html" target="_blank"class="link"></a>
Projekt 8</div>
<div class="inmenu9">
<a href="projekty/projekt9.html" target="_blank"class="link"></a>
Projekt 9</div>
<div class="inmenu10">
<a href="projekty/projekt10.html" target="_blank"class="link"></a>
Projekt 10</div>
<div style="clear:both;"></div>
</div>
<header>
<h1>Galeria</h1>
</header>
<div class="galery">
<div class="photo"></div>
<div class="image1">
<a href="#"><img src="img/01.jpg" alt="Taktsang"></a>
</div>
<div class="photo"></div>
<div class="image2">
<a href="#"><img src="img/02.jpg" alt="Taktsang"></a>
</div>
<div class="photo"></div>
<div class="image3">
<a href="#"><img src="img/03.jpg" alt="Taktsang"></a>
</div>
<div class="photo"></div>
<div class="image4">
<a href="#"><img src="img/04.jpg" alt="Taktsang"></a>
</div>
<div class="photo"></div>
<div class="image5">
<a href="#"><img src="img/05.jpg" alt="Taktsang"></a>
</div>
<div class="photo"></div>
<div class="image6">
<a href="#"><img src="img/06.jpg" alt="Taktsang"></a>
</div>
</div>
<div class="logo">
<h1> Kafelki</h1>
</div>
<div class="wrapper">
<div class="place">
<div class="tile">kafelek</div>
<div class="tile">kafelek1</div>
<div class="tile">kafelek2</div>
<div class="tile">kafelek3</div>
<div style="clear:both;"></div>
<div class="tile">kafelek4</div>
<div class="tile">kafelek5</div>
<div class="tile">kafelek6</div>
<div class="tile">kafelek7</div>
<div style="clear:both;"></div>
<div class="tile">kafelek8</div>
<div class="tile">kafelek9</div>
<div class="tile">kafelek10</div>
<div class="tile">kafelek11</div>
<div style="clear:both;"></div>
</div>
</div>
</div>
</div>
</body>
</html>
body {
color: white;
margin: none;
background-color: #535353;
font-family: 'Oswald', sans-serif;
}
header {
color: #FF9100;
font-size: 35px;
text-align: center;
margin-top: 0px;
font-family: 'Livvic', sans-serif;
}
.wrap {
background-color: #535353;
width: 100%;
height: 1000px;
}
.content {
background-color: #6D6D6D;
width: 1000px;
min-height: 500px;
margin: auto;
border: 3px solid white;
padding: 20px;
}
.galery {
width: 1000px;
min-height: 500px;
border: 3px solid white;
margin: auto;
padding: 20px;
background-color: #6D6D6D;
}
.photo {
display: inline-block;
width: 460px;
text-align: center;
padding: 5px;
}
.image1 {
width: 450px;
margin: auto;
}
.image2 {
width: 450px;
margin: auto;
}
.image3 {
width: 450px;
margin: auto;
}
.image4 {
width: 450px;
margin: auto;
}
.image5 {
width: 450px;
margin: auto;
}
.image6 {
width: 450px;
margin: auto;
}
.menu {
width: 1000px;
padding: 20px;
border: 3px solid white;
margin: auto;
margin-top: 20px;
color: #FF9100;
background-color:
}
.inmenu1 {
border-right: 3px solid white;
border-left: 3px solid white;
float: left;
margin: auto;
padding: 20px;
margin-left: 15px;
display: block;
}
.inmenu2 {
border-right: 3px solid white;
margin: auto;
padding: 20px;
float: left;
display: block;
}
.inmenu3 {
border-right: 3px solid white;
margin: auto;
padding: 20px;
float: left;
display: block;
}
.inmenu4 {
border-right: 3px solid white;
margin: auto;
padding: 20px;
float: left;
display: block;
}
.inmenu5 {
border-right: 3px solid white;
margin: auto;
padding: 20px;
float: left;
display: block;
}
.inmenu6 {
border-right: 3px solid white;
margin: auto;
padding: 20px;
float: left;
display: block;
}
.inmenu7 {
border-right: 3px solid white;
margin: auto;
padding: 20px;
float: left;
display: block;
}
.inmenu8 {
border-right: 3px solid white;
margin: auto;
padding: 20px;
float: left;
display: block;
}
.inmenu9 {
border-right: 3px solid white;
margin: auto;
padding: 20px;
float: left;
display: block;
}
.inmenu10 {
border-right: 3px solid white;
margin: auto;
padding: 20px;
float: left;
display: block;
}
.inmenu1:hover {
border-right: 3px solid white;
background-color: #535353;
cursor: pointer;
color: #FFCC80;
}
.inmenu2:hover {
border-right: 3px solid white;
background-color: #535353;
cursor: pointer;
color: #FFCC80;
}
.inmenu3:hover {
border-right: 3px solid white;
background-color: #535353;
cursor: pointer;
color: #FFCC80;
}
.inmenu4:hover {
border-right: 3px solid white;
background-color: #535353;
cursor: pointer;
color: #FFCC80;
}
.inmenu5:hover {
border-right: 3px solid white;
background-color: #535353;
cursor: pointer;
color: #FFCC80;
}
.inmenu6:hover {
border-right: 3px solid white;
background-color: #535353;
cursor: pointer;
color: #FFCC80;
}
.inmenu7:hover {
border-right: 3px solid white;
background-color: #535353;
cursor: pointer;
color: #FFCC80;
}
.inmenu8:hover {
border-right: 3px solid white;
background-color: #535353;
cursor: pointer;
color: #FFCC80;
}
.inmenu9:hover {
border-right: 3px solid white;
background-color: #535353;
cursor: pointer;
color: #FFCC80;
}
.inmenu10:hover {
border-right: 3px solid white;
background-color: #535353;
cursor: pointer;
color: #FFCC80;
}
.logo {
color: #FF9100;
font-size: 35px;
text-align: center;
}
.wrapper {
width: 1000px;
height: 450px;
background-color: #535353;
border: 3px solid white;
margin: auto;
padding: 20px;
padding-bottom: :30px;
margin-top: 25px;
}
.tile {
float: left;
text-align: center;
border: 3px solid white;
width: 120px;
height: 50px;
padding: 20px;
margin: 20px;
padding-top: 30px;
display: block;
}
.tile:hover {
border: 3px solid #FF9100;
color: #FF9100;
}
.place {
margin: auto;
margin-left: 90px;
}
a.link {
text-decoration: none;
color: #535353;
display: block;
}
. wszystkie podstrony są umieszczone w folderze o nazwie projekty.
