2016-06-28 18 views
0

Ich habe eine Website in PHP (html) und CSS geschrieben, und mein Problem ist, dass manchmal (in der Regel nach dem Umleiten), CSS-Ausrichtung bricht, und alles, außer Headerbild, bewegt zur oberen linken Ecke. Auf meinem Computer (auch wenn ich bereits über die auf dem Host-Server hochgeladene Seite spreche) kann ich dies durch eine Aktualisierung der Seite lösen, und plötzlich ist alles so, wie es sein sollte. Auf verschiedenen Geräten (ich habe es auf 2 verschiedenen Computern und 3 Telefonen probiert) wird es nie richtig angezeigt. Ich habe dies auf verschiedenen Browsern (Firefox, Chrome, Handy-Browser ...) versucht, aber es hat keinen Unterschied gemacht, so offensichtlich ist das Problem meine Codierung: D Wenn jemand interessiert ist, posten ich meine CSS-Code, wenn nicht, einfach überspringen.CSS-Ausrichtung funktioniert nicht auf verschiedenen Geräten

body{ 
 
\t font-family: Arial, sans-serif; 
 
\t font-size: 12pt; 
 
\t height: 100%; 
 
\t width: 100%; 
 
\t margin: 0px; 
 
} 
 
#page{ 
 
\t overflow: auto; 
 
\t background: #B6B1B1 url('img/background.JPG') no-repeat center; 
 
\t background-attachment: fixed; 
 
} 
 
img{ 
 
\t max-width: 100%; 
 
\t height: auto; 
 
\t width: auto\9; 
 
} 
 
#languages li a{ 
 
\t font-weight: bold; 
 
\t color: #191045; 
 
} 
 
#languages li a:hover{ 
 
\t color: #E49900; 
 
} 
 
h1 a span{ 
 
\t display: none; 
 
} 
 
h1 a{ 
 
\t width: 100%; 
 
\t height: 240px; 
 
\t display: block; 
 
\t position: absolute; 
 
\t background: transparent url('img/headerpic.png') no-repeat top center; 
 
} 
 
#menubar{ 
 
\t width: 70%; 
 
\t position: absolute; 
 
\t margin: 220 15% 0 15%; 
 
\t text-align: center; 
 
} 
 
#menu li{ 
 
\t display: inline-block; 
 
\t height: 40px; 
 
\t line-height: 40px; 
 
\t margin-top: 20; 
 
\t margin-left: 5px; 
 
\t padding: 0 15 0 15; 
 
\t background-color: rgba(25,16,69,0.85); 
 
\t border-radius: 5px; \t 
 
} 
 
#menu .selected{ 
 
\t background-color: rgba(255,255,255,0.85); 
 
\t border-style: solid; 
 
\t border-width: 3px; 
 
\t border-color: rgba(25,16,69,0.85); 
 
} 
 
#menu .selected a{ 
 
\t color: rgba(25,16,69,0.85); 
 
} 
 
#menu li a{ 
 
\t text-decoration: none; 
 
\t color: white; 
 
} 
 
#menu li a:hover{ 
 
\t color: #E49900; 
 
} 
 

 
#main{ 
 
\t min-height: 350; 
 
\t position: relative; 
 
\t display:block; 
 
\t background-color: rgba(255,255,255,0.85); 
 
\t width: 70%; 
 
\t margin-left: 15%; 
 
\t margin-right: 15%; 
 
\t margin-top: 340; 
 
\t padding: 15 15 15 15; 
 
\t border-radius: 10px; 
 
\t color: black; 
 
} 
 
footer{ 
 
\t position: relative; 
 
\t background-color: rgba(255,255,255,0.85); 
 
\t width: 70%; 
 
\t margin-left: 15%; 
 
\t margin-right: 15%; 
 
\t margin-top: 15; 
 
\t padding: 2.5 15 2.5 15; 
 
\t border-radius: 10px; 
 
\t display: inline-block; 
 
\t bottom: 5px; 
 
\t color: black; 
 
\t font-size: 80%; 
 
\t text-align: center; 
 
} 
 
#footer a{ 
 
\t text-decoration: none; 
 
\t color: black; 
 
} 
 
#footer a:hover{ 
 
\t color: #E49900; 
 
}

Vielen Dank für alle Tipps :)

+1

Versuchen Sie, Ihre Frage präziser zu formulieren, nur was Sie brauchen; Nicht allzu viele Leute wollen diese Wände aus Text und Code lesen. –

+0

beheben Sie Ihre CSS: 'width: auto \ 9;'. auto9? –

+0

@AnthonyAstine Es tut mir leid, wenn es zu lang ist, wollte ich es nur im Detail erklären, denn normalerweise sagen mir die Leute, dass meine Erklärungen nicht sehr hilfreich sind ... und jetzt weiß ich nicht, was ich übergehen soll: D –

Antwort

0

Also, mein „Oh so ein großer Fehler“ war, dass ich nicht schreiben Einheiten hinter der Zahl im Rande, padding und so weiter ... Ich habe einfach zum Beispiel 10 geschrieben. Als ich px/em ... dahinter eingefügt habe, hat plötzlich alles funktioniert: D

Ich weiß immer noch nicht, warum es so lange gedauert hat, es zu realisieren. . -_-

Verwandte Themen