Ankündigung

Einklappen
Keine Ankündigung bisher.

CSS wird auf Server nicht richtig angezeigt

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • CSS wird auf Server nicht richtig angezeigt

    Moinsen,

    ich habe meine Homepage über unseren Schulserver laufen und alles grad hochgeladen, jedoch wird meine erste CSS auf dem Server nicht so angezeigt wie auf meinem PC.

    Was ich meine ist in den Bildern zu sehen.

    Alle Dateien auf dem Server sind identisch mit denen auf meinem PC, allerdings will die erste Seite einfach nicht das richtige Bild laden, den Button anzeigen und per CSS opacity aktivieren. Hat jemand eine Idee warum das so sein kann?

    Hier die HTML und CSS:



    /*
    Plugin: jQuery Parallax
    Version 1.1.3
    Author: Ian Lunn
    Twitter: @IanLunn
    Author URL: http://www.ianlunn.co.uk/
    Plugin URL: http://www.ianlunn.co.uk/plugins/jquery-parallax/

    License: http://creativecommons.org/licenses/by-sa/3.0/ (Attribution Share Alike). Please attribute work to Ian Lunn simply by leaving these comments in the source code or if you'd prefer, place a link on your website to http://www.ianlunn.co.uk/.
    */

    @charset "utf-8";
    /* CSS Document */

    body{
    margin: 0;
    min-width: 980px;
    padding: 0;
    }

    p{
    margin: 20px 0 0 0;
    }

    p, ul{
    font-family:"Proxima Nova Light", 'Helvetica Neue', Arial, Helvetica, sans-serif;
    font-size-adjust:0.5;
    font-weight:200;
    font-style:normal;
    opacity: 0.6;
    color: #FFFFFF;
    }

    .button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
    }

    .button1 {
    background-color: #555555;
    color: white;
    border: 4px solid #555555;
    opacity: 0.7;
    border-radius: 4px;
    }

    .button1:hover {
    background-color: white;
    color: #555555;
    opacity: 0.7;
    border-radius: 4px;
    }

    img{
    border: 0;
    }

    h1, #pixels{
    font-family:"Museo 900", Verdana, serif;
    font-size-adjust:0.40;
    font-weight:700;
    font-style:normal;
    }

    h2{
    font-family:"Beau Sans Pro Book", Verdana, sans-serif;
    font-size-adjust:0.531;
    font-weight:500;
    font-style:normal;
    color: #555555;
    opacity: 0.7;
    }

    #header h1, #pixels{
    color: #fffff;
    opacity: 0;
    }

    .float-left{
    float: left;
    margin: 0 0 0 20px;
    }

    .float-right{
    float: right;
    margin: 0 20px 0 0;
    }

    .center{
    font-size: 2.5em;
    padding: 80px 0 0 0;
    text-align: center;
    }

    #nav{
    list-style: none;
    position: fixed;
    right: 0px;
    opacity: 0;
    }

    #header, #intro, #second{
    width: 100%;
    }

    #intro{
    background:url(images/pic2.png) 100% 0 repeat fixed;
    color: white;
    height: 900px;
    margin: 0 auto;
    padding: 0;
    }

    .story{
    margin: 0 auto;
    min-width: 980px;
    overflow: auto;
    width: 980px;
    }

    .story .float-left, .story .float-right{
    padding: 100px 0 0 0;
    position: relative;
    width: 350px;
    }

    #accordion{
    background-color: black;
    height:20px; /////////////DEACTIVATED///////////////
    position: right;
    transition: height 1s ease-in-out;

    }

    #accordion:hover{
    background-color: black;
    height: 140px; /////////////DEACTIVATED///////////////
    animation-direction: left;

    }

    #accordion{
    width: 60px;
    height: 60px; /////////////DEACTIVATED///////////////
    background: red;
    -webkit-transition: width 1s, height 1s, -webkit-transform 1s; /* MACOS */
    transition: width 1s, height 1s, transform 1s;
    }

    #accordion:hover {
    width: 150px;
    height: 150px; /////////////DEACTIVATED///////////////
    -webkit-transform: rotate(360deg); /* MACOS */
    transform: rotate(360deg);
    }

    @keyframes fullexpand {

    0%, 20%, 40%, 60%, 80%, 100% { width: 0%; opacity: 0; }
    4%, 24%, 44%, 64%, 84% { width: 0%; opacity: 0.3; }
    16%, 36%, 56%, 76%, 96% { width: 100%; opacity: 0.7; }
    17%, 37%, 57%, 77%, 97% { width: 100%; opacity: 0.3; }
    18%, 38%, 58%, 78%, 98% { width: 100%; opacity: 0; }
    }
    MfG
    Silas Daebler
    Angehängte Dateien
    Zuletzt geändert von playzocker22; 28.05.2018, 21:28.

  • #2
    Nein, aus den Bildern kann ich leider nichts erkennen.
    jedoch wird meine erste CSS auf dem Server nicht so angezeigt wie auf meinem PC.
    Erster Kandidat für die Fehlerursache in solch einem Fall: Groß- und Kleinschreibung bei Dateinamen. Windows ist es egal, auf dem Server ist jedoch z. B. styles.css etwas anderes als Styles.css.

    Kommentar

    homepage-forum.de - Hilfe für Webmaster! Statistiken

    Einklappen

    Themen: 56.443   Beiträge: 428.375   Mitglieder: 27.848   Aktive Mitglieder: 64
    Willkommen an unser neuestes Mitglied, spartacus99.

    Online-Benutzer

    Einklappen

    553 Benutzer sind jetzt online. Registrierte Benutzer: 2, Gäste: 551.

    Mit 1.625 Benutzern waren am 17.03.2018 um 18:52 die meisten Benutzer gleichzeitig online.

    Die neuesten Themen

    Einklappen

    • Andre1
      Startseite Beispiel Design
      Hallo an alle,

      soweit ist meine Startseite für mein Beispiel Design fertig. Es ist auch mobil eingerichtet,
      da es eine Flexbox ist geht das doch recht gut, nur der IE11 brauchte wieder eine Extrawurst.

      Ich möchte euch bitten die Seite anzuschauen und mir mitzuteilen,...
      Heute, 15:53
    • basti1012
      Antwort auf Gleiche Höhe für Sidebar und Content-Divs , aber wie ?
      du solltest die Seite auf Flexbox aumbauen. Dann sind solche Sachen wie float und padding-bottom:700px; nicht mehr nötig.
      Das Flexbox system erleichtert dir einiges

      Ich habe mal den mitleren Bereich Flexbox gegeben, da siehst du das es jetzt immer gleich hoch ist.
      https://c...
      Heute, 15:08
    • helmchen
      Antwort auf Umreifungsgerät
      Hallo Karl!
      Die erste Frage dürfte sein wie oft Du es verwendest. Da gibt es riesen Preisunterschiede.
      Ich nutze das Zapak ZP-93 und bin damit sehr zufrieden.
      LG helmchen
      Heute, 10:41
    • helmchen
      Antwort auf Wo könnte ich mich nach einem Automower umsehen?
      Hallo!
      Danke für den Link zum Video. Bin auch gerade auf der Suche und da war es sehr hilfreich.
      LG
      Heute, 10:18
    • Atlan
      Antwort auf smooth scrolling
      Genau, wie oben, in JQuery! Aber ich will kein JQuery mehr ! (schlechte Erfahrung). Darum suche ich auch smooth scroll to top & Anker in same CSS or JavaScript.Habe mal bei codepen einen Freund gefragt, der meinte da würde es Probleme geben ? Welche ? Keine Ahnung. Tja, such mer weider (LOL)...
      23.06.2019, 16:50
    SimpleSite

    Die neuesten Beiträge

    Einklappen

    • Andre1
      Startseite Beispiel Design
      Hallo an alle,

      soweit ist meine Startseite für mein Beispiel Design fertig. Es ist auch mobil eingerichtet,
      da es eine Flexbox ist geht das doch recht gut, nur der IE11 brauchte wieder eine Extrawurst.

      Ich möchte euch bitten die Seite anzuschauen und mir mitzuteilen,...
      Heute, 15:53
    • Bernhard
      Gleiche Höhe für Sidebar und Content-Divs , aber wie ?
      Sidebar und Content auf gleiche Höhe bringen

      Hallo,

      nachdem ich endlich Text UND Fotos in meinen Divs responsiv so unterbringen kann, dass sie nicht mehr beim Zusammenschieben des Browserfensters aus dem Rahmen geschoben werden (Danke für Eure Hilfe dabei), habe ich noch...
      14.06.2019, 17:53
    • basti1012
      Antwort auf Gleiche Höhe für Sidebar und Content-Divs , aber wie ?
      du solltest die Seite auf Flexbox aumbauen. Dann sind solche Sachen wie float und padding-bottom:700px; nicht mehr nötig.
      Das Flexbox system erleichtert dir einiges

      Ich habe mal den mitleren Bereich Flexbox gegeben, da siehst du das es jetzt immer gleich hoch ist.
      https://c...
      Heute, 15:08
    • admin
      Umreifungsgerät
      Hier eine weiter Frage zum Thema Pakete packen und verschicken:

      Wer nutzt ein Umreifungsgerät? Und zwar welches, und wie zufrieden seid ihr damit?

      Gruß
      Karl
      19.06.2019, 19:24
    • helmchen
      Antwort auf Umreifungsgerät
      Hallo Karl!
      Die erste Frage dürfte sein wie oft Du es verwendest. Da gibt es riesen Preisunterschiede.
      Ich nutze das Zapak ZP-93 und bin damit sehr zufrieden.
      LG helmchen
      Heute, 10:41
    • helmchen
      Antwort auf Wo könnte ich mich nach einem Automower umsehen?
      Hallo!
      Danke für den Link zum Video. Bin auch gerade auf der Suche und da war es sehr hilfreich.
      LG
      Heute, 10:18
    • Atlan
      smooth scrolling
      Freunde, brauche eine Rat oder Tipp.
      Folgendes:
      dieser JS code bringt mir ein smooth scrolling für die one-page, von rechts unten zum "top".
      (Also normales crolling für eine Seite)
      ( OK es ist JQuery, dient nur als Beispiel zum Testen)

      (function($) {...
      17.06.2019, 09:34
    • Atlan
      Antwort auf smooth scrolling
      Genau, wie oben, in JQuery! Aber ich will kein JQuery mehr ! (schlechte Erfahrung). Darum suche ich auch smooth scroll to top & Anker in same CSS or JavaScript.Habe mal bei codepen einen Freund gefragt, der meinte da würde es Probleme geben ? Welche ? Keine Ahnung. Tja, such mer weider (LOL)...
      23.06.2019, 16:50
    • steffle
      Antwort auf Soziale Netze und ihr Nutzen
      Nein! Aber darum geht es auch nicht. Lies dir mal das durch. Social Media und Networking ist ein Trend und wer nicht mitmacht, bleibt zurück....
      23.06.2019, 16:04
    • Andre1
      Problem mit Flaxbox
      Hallo an alle,

      ich hebe ein Problem mit einer Einstellung, einmal bei der Flexbox, da wollte ich eine Zweite,
      aber jetzt gehen die Links bei den oberen Boxen nicht mehr.
      Könnte mir jemand helfen und in die HTML und CSS schauen und mir bei den Fehlern helfen? Danke
      ...
      21.06.2019, 23:51
    Lädt...
    X