zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Seite auf mobiler Ansicht gleich wie auf Desktop

Antwort
 
LinkBack Themen-Optionen Ansicht
  #41 (permalink)  
Alt 21.08.2018, 22:41
Benutzer
neuer user
 
Registriert seit: 10.07.2018
Beiträge: 83
Sailor56 befindet sich auf einem aufstrebenden Ast
Standard

zu 1.
Sehr ungeschickt, was du da machst... alle Formate die du in deinem Grundlayout (außerhalb der @mediaQuers) gelten in deinem Fall für alles und damit sowieso für größer 480px! Ist also Quatsch da jetzt so eine Konstuktion zu basteln - das Format für
HTML-Code:
#Overheader a{
        text-align: center;
}
hast du oben schon stehen (ca Zeile 107).. schreib den Code für die Farbe da mit zu. Die gewünschte Farbänderung dann in die @mediaQuery ..
das sollte übrigens
HTML-Code:
@media screen and (max-width: 480px) {

}
heißen... ob jeder Browser mit der verstümmelten @media, die du da nutzt was anfangen kann, wage ich zu bezweifeln.

Dein Problem mit dem Logo sollte eigentlich kein Problem sein, denn dieses Konstrukt im Kopfteil (mit dem Flexlayout) ist an sich responsie und das was ich da sehe deutet darauf hin, dass du genau dort was in der @media umformatiert hast... also was schon funktionierendes so manipuliert hast, dass es nicht mehr richtig funktioniert.
Ich habe zwar noch nicht ganz durchschaut, was da schief läuft... aber du solltest zunächst mal das
HTML-Code:
#banner {
    height: 80px;
löschen... #banner ist immer so hoch wie Inhalt vorgibt.
Ich habe nur noch rausgefunden, warum das Logo plötzlich größer wird?

Oder doch.. ich glaube jetzt seh ich es. Du hast die anderen 3 Buttons kleiner gemacht, deswegen stimmen die Proportionen nicht mehr
Das verkleinern auf 80% müsstest du dann beim Logo auch in der @media unterbringen.
Mit Zitat antworten
Sponsored Links
  #42 (permalink)  
Alt 21.08.2018, 22:49
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.08.2018
Beiträge: 52
IxonTV befindet sich auf einem aufstrebenden Ast
Standard

Hab jetzt die mediaquery raus und alles soweit richtig, ich setze jetzt weiter unten in Overheader a die color auf black, genauso wie beim a:hover. Nur wird jetzt die mediaquery als solche scheinbar nicht mehr erkannt. Blöd auch, dass Notepad++ die MediaQueries nicht erkennt und es somit kein farbiges Interface gibt...
Mit Zitat antworten
Sponsored Links
  #43 (permalink)  
Alt 21.08.2018, 23:24
Benutzer
neuer user
 
Registriert seit: 10.07.2018
Beiträge: 83
Sailor56 befindet sich auf einem aufstrebenden Ast
Standard

Dann schreib mal die @media mit der richtigen Syntax!
HTML-Code:
@media screen and (max-width: 480px) {

}
Auch (fehlende) Leerzeichen können Probleme bereite.

...ach ja Zeile 223ff ... color: none; gibt es nicht!

und für das Logo schreibst du bitte nur ...
HTML-Code:
#logo1 {
	width: 80%;
}
in die @media.
Mit Zitat antworten
  #44 (permalink)  
Alt 21.08.2018, 23:45
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.08.2018
Beiträge: 52
IxonTV befindet sich auf einem aufstrebenden Ast
Standard

Super, funktioniert jetzt alles!
Nur noch ein paar Kleinigkeiten nicht: zB die Links im Footer, die sehen etwas verkrüppelt aus
Mit Zitat antworten
  #45 (permalink)  
Alt 22.08.2018, 07:29
Benutzer
neuer user
 
Registriert seit: 10.07.2018
Beiträge: 83
Sailor56 befindet sich auf einem aufstrebenden Ast
Standard

Und wie sollen die Footer-Links auf dem Dedktop aussehen...?
Wie sich beim kleiner werden verhalten...?
Wie dann auf dem Handy-Display ...?

Du solltest dir überlegen, ob es nicht besser wäre deinen Hauptteil bei kleinerem Display von 2 Spalten nebeneinander auf auf 1 Spalte untereinander umzustellen.
So wie es jetzt ist wirkt es nicht gut... zu klein, zu gedrängt, nicht augenfreundlich.
Mit Zitat antworten
  #46 (permalink)  
Alt 22.08.2018, 13:30
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.08.2018
Beiträge: 52
IxonTV befindet sich auf einem aufstrebenden Ast
Standard

In der mobilen Ansicht rutschen die Links so schräg untereinander, in der Desktop Ansicht ist das richtig. Ich gucke mal wie ich das mit dem ein spalten Design umsetze
Mit Zitat antworten
  #47 (permalink)  
Alt 22.08.2018, 13:38
Benutzer
neuer user
 
Registriert seit: 10.07.2018
Beiträge: 83
Sailor56 befindet sich auf einem aufstrebenden Ast
Standard

Nun ja... was sollen die armen Links auch anders machen, wenn sie so...
HTML-Code:
.footer a {
    color: white;
    padding: 20px;
    margin-top: 50px;
    margin-left: 150px;
    font-weight: bold;
}
formatiert sind?
Versuch doch mal das auf Flexbox umzustellen - Beispiele hast du ja oben im Code!
Feste Größenangaben sind .... bääähhh!
Mit Zitat antworten
  #48 (permalink)  
Alt 22.08.2018, 13:56
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.08.2018
Beiträge: 52
IxonTV befindet sich auf einem aufstrebenden Ast
Standard

Okay xD
Mit Zitat antworten
  #49 (permalink)  
Alt 27.11.2018, 14:07
Neuer Benutzer
neuer user
 
Registriert seit: 27.11.2018
Beiträge: 1
Welds1996 befindet sich auf einem aufstrebenden Ast
Standard

sie können nur Teile davon sehen oder gar nichts?
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Seite in Seite B3ndech0 Javascript & Ajax 12 06.01.2010 14:42
Wordpress Seite Passwort-Schützen? sepp88 Serveradministration und serverseitige Scripte 5 01.11.2009 13:56
Seite wird auf anderem Computer falsch dargestellt Patrick Egli CSS 3 01.11.2009 11:40
Shtml auf jeder Seite einbinden - counter iVx Serveradministration und serverseitige Scripte 1 13.09.2007 18:31
Fixer Header (CSS Frame) und Sprung zu Anker auf dieser Seite Chico_wau CSS 2 14.05.2007 19:08


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:42 Uhr.