Google Chrome zeigt Impressum komplett komisch

  • HTML

Es gibt 2 Antworten in diesem Thema. Der letzte Beitrag () ist von LaMiy.

    Google Chrome zeigt Impressum komplett komisch

    Hallo Kann mir jemand von euch sagen weshalb Google Chrome das Impressum auf meiner Seite komplett komisch anzeigt?
    Die Lokale Datei wird ganz normal angezeigt.

    Hier ist die Chrome Version:

    Und hier von der Lokalen Datei:
    Kann mir das jemand erklären?

    Impressum.html:

    HTML-Quellcode

    1. <!DOCTYPE html>
    2. <html>
    3. <head>
    4. <!--- META-Deklarationen --->
    5. <meta charset="utf-8">
    6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7. <!--- Generelles --->
    8. <title>b l o c k</title>
    9. <!--- CSS --->
    10. <link rel="stylesheet" href="css/style.css">
    11. <link href="css/bootstrap.min.css" rel="stylesheet">
    12. <link rel="stylesheet" href="css/card.css">
    13. <!--- JS-Scripts --->
    14. <script src="js/bootstrap.min.js"></script>
    15. <script src="js/jquery.min.js"></script>
    16. </head>
    17. <body>
    18. <center>
    19. <div class="card">
    20. <div class="card_container">
    21. <h2>Impressum</h2>
    22. <h2>Angaben gem&auml;&szlig; &sect; 5 TMG</h2>
    23. <p>Johannes Werner<br />
    24. <h2>Kontakt</h2>
    25. <p>E-Mail: block_exception@protonmail.com</p>
    26. <h3>Haftung f&uuml;r Inhalte</h3> <p>Als Diensteanbieter sind wir gem&auml;&szlig; &sect; 7 Abs.1 TMG f&uuml;r eigene Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach &sect;&sect; 8 bis 10 TMG sind wir als Diensteanbieter jedoch nicht verpflichtet, &uuml;bermittelte oder gespeicherte fremde Informationen zu &uuml;berwachen oder nach Umst&auml;nden zu forschen, die auf eine rechtswidrige T&auml;tigkeit hinweisen.</p> <p>Verpflichtungen zur Entfernung oder Sperrung der Nutzung von Informationen nach den allgemeinen Gesetzen bleiben hiervon unber&uuml;hrt. Eine diesbez&uuml;gliche Haftung ist jedoch erst ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung m&ouml;glich. Bei Bekanntwerden von entsprechenden Rechtsverletzungen werden wir diese Inhalte umgehend entfernen.</p> <h3>Haftung f&uuml;r Links</h3> <p>Unser Angebot enth&auml;lt Links zu externen Websites Dritter, auf deren Inhalte wir keinen Einfluss haben. Deshalb k&ouml;nnen wir f&uuml;r diese fremden Inhalte auch keine Gew&auml;hr &uuml;bernehmen. F&uuml;r die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber der Seiten verantwortlich. Die verlinkten Seiten wurden zum Zeitpunkt der Verlinkung auf m&ouml;gliche Rechtsverst&ouml;&szlig;e &uuml;berpr&uuml;ft. Rechtswidrige Inhalte waren zum Zeitpunkt der Verlinkung nicht erkennbar.</p> <p>Eine permanente inhaltliche Kontrolle der verlinkten Seiten ist jedoch ohne konkrete Anhaltspunkte einer Rechtsverletzung nicht zumutbar. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Links umgehend entfernen.</p> <h3>Urheberrecht</h3> <p>Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Die Vervielf&auml;ltigung, Bearbeitung, Verbreitung und jede Art der Verwertung au&szlig;erhalb der Grenzen des Urheberrechtes bed&uuml;rfen der schriftlichen Zustimmung des jeweiligen Autors bzw. Erstellers. Downloads und Kopien dieser Seite sind nur f&uuml;r den privaten, nicht kommerziellen Gebrauch gestattet.</p> <p>Soweit die Inhalte auf dieser Seite nicht vom Betreiber erstellt wurden, werden die Urheberrechte Dritter beachtet. Insbesondere werden Inhalte Dritter als solche gekennzeichnet. Sollten Sie trotzdem auf eine Urheberrechtsverletzung aufmerksam werden, bitten wir um einen entsprechenden Hinweis. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Inhalte umgehend entfernen.</p>
    27. <p>Quelle: <a href="https://www.e-recht24.de/impressum-generator.html">https://www.e-recht24.de/impressum-generator.html</a></p>
    28. </div>
    29. </div>
    30. </center>
    31. </body>
    32. </html>


    card.css:

    Quellcode

    1. ​.card {
    2. box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    3. margin: 5%;
    4. margin-left: 500px;
    5. margin-right: 500px;
    6. transition: 0.3s;
    7. color: white;
    8. font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif;
    9. text-shadow: 2px 2px #000000;
    10. }
    11. .card:hover {
    12. box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
    13. }
    14. .card_container {
    15. padding: 2px 16px;
    16. }


    style.css:

    Quellcode

    1. ​body {
    2. background-image: url(../img/bg.jpg);
    3. background-size: cover;
    4. background-repeat: no-repeat;
    5. }
    Du unterscheidest zwischen Chrome und Lokal. Mit welchem Browser hast du denn die lokale Version getestet? Oder tritt das Problem einfach nur online auf?
    Besucht auch mein anderes Forum:
    Das Amateurfilm-Forum
    @blockEX
    Der einzige Unterschied ist doch, dass dein Hintergrundbild nicht geladen wird.
    Vermutlich passt der Pfad url(../img/bg.jpg) lokal, aber eben nicht auf dem Server.
    Du kannst testen ob es daran liegt, indem du mal einen Webpfad ausprobierst.
    z.B background-image: url(https://images.pexels.com/photos/1020315/pexels-photo-1020315.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940g);

    Habe hier codepen.io/il4miy/pen/mYrrjL mal in Chrome getestet. Klappt wunderbar.