Hallo lieb Community,
Ich arbeite derzeit noch mit Siquando pro 6 im Unterverzeichnis um unsere Website neu aufzubauen; https://pilzkopfverriegelungen.de/
Unterverzeichnis: buchfink/
habe folgenden HTML Code im Bereich "Unten" eingefügt, um Social Media Buttons, die entsprechend verlinken einzufügen:
<!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" />
<title>Social Media Buttons</title>
<link rel="stylesheet" href="style.css" />
<link
rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.4.1/css/all.css"
/>
</head>
<body>
<div class="middle">
<a class="btn" href="https://www.facebook.com/einbruchsicherungen/">
<i class="fab fa-facebook-f"></i>
</a>
<a class="btn" href="https://www.instagram.com/buchfink.einbruchsicherungen/">
<i class="fab fa-instagram"></i>
</a>
<a class="btn" href="https://www.youtube.com/channel/UCxUz_zquhcfFv5ts1eVHB0w/videos?view=0&sort=p">
<i class="fab fa-youtube"></i>
</a>
</div>
</body>
</html>
Begleitet von folgendem CSS als style-tag im header der Website-Eigenschaften unter dem Reiter HTML:
<style> type="text/css"
body {
padding: 0;
margin: 0;
}
.middle {
position: static;
width: 100%;
text-align: center;
}
.btn {
display: inline-block;
width: 90px;
height: 90px;
background: #f1f1f1;
margin: 10px;
border-radius: 30%;
box-shadow: 0 5px 15px -5px #00000070;
color: #c50d00;
overflow: hidden;
position: relative;
}
.btn i {
line-height: 90px;
font-size: 36px;
transition: 0.2s linear;
}
.btn:hover i {
transform: scale(1.3);
color: #f1f1f1;
}
.btn::before {
content: "";
position: absolute;
width: 120%;
height: 120%;
background: #c50d00;
transform: rotate(45deg);
left: -110%;
top: 90%;
}
.btn:hover::before {
animation: aaa 0.7s 1;
top: -10%;
left: -10%;
}
@keyframes aaa {
0% {
left: -110%;
top: 90%;
}
50% {
left: 10%;
top: -30%;
}
100% {
top: -10%;
left: -10%;
}
}
</style>
Folgende Fehlermeldungen werden jetzt angezeigt wenn ich in Chrome mit Rechtsklick "Untersuchen" anklicke:
Kann jemand einschätzen wie "schlimm" diese Fehler sind? Die Seite sieht eigentlich noch so aus wie zuvor - worauf kann sich der Fehler also auswirken und wie kann ich ihn beheben?
liebe Grüße,
Stephan