Zodra ik echter een van deze woorden voorzie van een link dan werkt dit niet meer. in de code zie je bij boerenzwaluw een woord zonder link, daarboven zijn de woorden voorzien van een link. hieronder de Css style
en html. Wie weet hier een oplossing voor?
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Vogelalfabet</title>
<meta name="Vogelfoto's A tot en met Z" content="width=device-width, initial-scale=1.0">
<style>
* {
box-sizing: border-box;
}
.row::after {
content: "";
clear: both;
display: block;
}
a:link {
text-decoration: none;
}
/* unvisited link */
a:link {
color: white;
}
/* visited link */
a:visited {
color: white;
}
a:visited {
text-decoration: none;
}
[class*="col-"] {
float: left;
padding: 15px;
}
html {
font-family: "Lucida Sans", sans-serif;
}
.header {
background-color: #666666;
color: #ffffff;
padding: 15px;
}
.menu ul {
list-style-type: none;
margin: 0;
padding: 0;
}
.menu li {
padding: 8px;
margin-bottom: 7px;
background-color: #666666;
color: #ffffff;
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
.menu li:hover {
background-color: #0099cc;
}
.aside {
background-color: #666666;
padding: 15px;
color: #ffffff;
text-align: center;
font-size: 14px;
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
.footer {
background-color: #666666;
color: #ffffff;
text-align: center;
font-size: 12px;
padding: 15px;
}
/* For desktop: */
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 16.66%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}
@media only screen and (max-width: 768px) {
/* For mobile phones: */
[class*="col-"] {
width: 100%;
}
}
}
</style>
</head>
<body style=" background-color: #999999;"> <br>
<div class="header">
<h2 style="background-color: rgb(102, 102, 102); text-align: center;"><span
style="font-family: Gentium Book Basic;">Houjesnavel</span></h2>
</div>
<div class="row">
<div class="col-3">
<div style="text-align: center;">
<p><span style="color: #e0e0e0;">A </span></p>
</div>
<p> </p>
<div style="text-align: center;">
<p><a href="Aalscholver/Aalscholver.html" title="Aalscholver"><span style="color: #e0e0e0;">Aalscholver</span></a></p>
</div>
<p> </p>
<div style="text-align: center;">
<p><a href="Alk/Alk.html" title="Alk"><span style="color: #e0e0e0;">Alk</span></a></p>
</div>
<p> </p>
<div style="text-align: center;">
<p><a href="Appelvink/Appelvink.html" title="Appelvink"><span style="color: #e0e0e0;">Appelvink</span></a></p>
</div>
<p> </p>
<p> </p>
<div style="text-align: center;">
<p><span style="color: #e0e0e0;">B</span></p>
</div>
<p> </p>
<div style="text-align: center;">
<p><a href="Bergeend/Bergeend.html" title="Bergeend"><span style="color: #e0e0e0;">Bergeend</span></a></p>
</div>
<p> </p>
<div style="text-align: center;">
<p><a href="Blauwborst/Blauwborst.html"><span style="color: #e0e0e0;">Blauwborst</span></a></p>
</div>
<p> </p>
<div style="text-align: center;">
<p><a href="file:///D:/Nieuwe%20website/Alle%20bestanden/Website2025/Blauwe%20kiekendief/Blauwe%20kiekendief.html"><span
style="color: #e0e0e0;">Blauwe kiekendief</span></a></p>
</div>
<p> </p>
<div style="text-align: center;">
<p><a href="Blauwe%20kiekendief/Blauwe%20kiekendief.html"><span style="color: #e0e0e0;">Blauwe
reiger</span></a></p>
</div>
<p> </p>
<div style="text-align: center;">
<p><span style="color: #e0e0e0;">Boerenzwaluw</span></p>
[size=xsmall]Toevoeging op 17/01/2025 14:09:17:[/size]
Mijn fout; ik had niet alleen links toegevoegd maar ook de meta name gewijzigd; was viewport en dat moet natuurlijk blijven staan zo weet ik nu. Ik weet even niet hoe ik dit topic kan verwijderen.
