Diskussionsgruppe: Webseiten/HTML
Moin,
verzweifele im Moment an einem CSS-Layout,
http://www.russland-online.org/index2.php, hatte einfach gehofft ihr hättet ein paar elementare Tipps für mich bezüglich Browserkompatiblität und verschiedenen Auflösungen, ehrlich gesagt sieht es nur in Opera auf 1024x768 überhaupt halbwegs vernünftig aus. ;)
Wobei hier aber auch noch ein Problem besteht. height:100% wird leider nur als Höhe des Browserfenster interpretiert und nicht als Höhe des Dokumentes u.a. zu sehen bei den Hintergrundgrafiken auf der linken und rechten Seite.
Bezüglich der Probleme bei verschiedenen Browsern hab ich leider gar keine Idee (bin ja noch halbwegs css-Anfänger), wegen der Auflösungen hatte ich vermutet, dass es entweder mit den Bildern oder mit den noch teilweise vorhandenen Tabellen zusammenhängt.
Hoffe jemand gibt sich mal die Mühe sich den Code anzuschauen. ;)
Grüße,
S1lv3R
Von: S1lv3R Datum: 21.03.2007, 16:05
Antwort 1
von rfb vom 21.03.2007, 16:22
Wozu brauchst du die position:absolute-Keule?
Tipps:
trenne erst einmal Inhalt (HTML) und Layout (CSS) und schmeiss dabei die Layouttabellen raus. So ist jetzt der Code nicht lesbar und Ratschläge daraufhin wären absurd. Tät' mich wundern, wenn du da selber noch durchsteigst.
entferne den Landgericht-Hamburg-Unsinn aus dem Impressum - dieses legendäre Urteil hat was ganz anderes besagt als du meinst.
mach deinen Code valide, damit die Browser überhaupt kapieren können was du willst und nicht raten müssen.
Antwort 2
von S1lv3R vom 21.03.2007, 16:46
Ok, erstmal danke für die Hinweise und die schnelle Antwort.
Ich will aber erstmal ein paar Sachen nachfragen bevor ich nochmal total umbaue.
Zitat:
Wozu brauchst du die position:absolute-Keule?
Wie soll es sonst gehen? Mit float? Ich fand die position:absolute Lösung mit margin ganz praktisch - und vorallem simpel. Was für Nachteile hat denn die "position:absolute-Keule"?
[quote... ]und schmeiss dabei die Layouttabellen raus. Layouttabellen? Also ich dachte immer es wäre legitim Tabellen z.B. auf dieser Seite im "Letzte Beiträge aus dem Forum:"-Block zu benutzen, ich wüsste gar nicht wie ich solche Inhalte sonst in dieser Form strukturieren könnte.
Danke für den Hinweis mit dem Impressum, man fällt in dieser Hinsicht als Laie ja doch auf einigen Schwachsinn herein. ;)
Antwort 3
von rfb vom 21.03.2007, 17:48
Mit position:absolute nimmst du das Element aus dem Fluss, alle anderen ignorieren es dann mehr oder weniger - das ist die Keule. Du musst anschließend für (fast) jedes Element explizit angeben wo es sich befinden soll.
float dagegen überlässt sowas dem Browser.
Tabellen für tabellarische Daten - auf die Forumsbeiträge mag das zutreffen, aber das ist doch nicht die einzige Tabelle auf der Seite, es gibt mindestens 10!
Laie bin ich auch.
Antwort 4
von S1lv3R vom 22.03.2007, 02:19
N'abend nochmal. ;)
Habe noch ein bisschen dran gearbeitet.
Bei den Boxen rechts komme ich allerdings mit float irgendwie nicht weiter.
Also vereinfacht weiss ich einfach nicht wie man sowas hier mit float hinkriegt.
Antwort 5
von rfb vom 22.03.2007, 10:45
Gegenfrage: warum willst du sowas "hinkriegen"?
Erschließt sich solch eine Anordnung aus dem Content? Das dürfte in den wenigsten Fällen so sein, außer bei irgendwelchen überdesignerten Künstlerseiten (die dann in der Hälfte aller Browser Sch... aussehen), da dabei auch die Anordnung Informationen tragen soll.
Und um die Frage trotzdem zu beantworten: wenn es sich nur um die Anordnung der farbigen Kästen geht ist hier position wirklich notwendig - mit allen Problemen die position mit sich bringt.
Antwort 6
von S1lv3R vom 23.03.2007, 00:19
Also prinzipiell geht es dabei ja nur um die Login und Suche-Box auf der Startseite.
Wegen denen muss ich auch nochmal nachhaken:
Kann man mit float 2 divs übereinander legen? Mit position ist es ja kein problem überlappende Ebenen zu erstellen. Also konkret geht es um die Login/Suche-Box die über dem Hintergrund liegen, ist das mit float möglich?
Und mit dem Hintergrund bin ich irgendwie immer noch nicht weiter. Die einzigste Lösung die ich gefunden habe ist wieder eine potentielle "Keule": position:fixed.
Naja wenn ich position:fixed zusammen mit z-index nehme hätte ich sogar beide Probleme gelöst - allerdings gibt es dort wieder Probleme mit dem Internet Explorer.
Hättest du denn sonst noch eine Idee den Hintergrund über 100% des Dokumentes zu kriegen?
Antwort 7
von rfb vom 23.03.2007, 08:52
CSS-Eigenschaft background ?
Antwort 8
von S1lv3R vom 23.03.2007, 12:36
.background_r {
float:left;
width:15px;
height:100%;
background: url(templates/RedSilver/images/r.gif) repeat-y;
}
So sieht es im Moment aus und so funktioniert es nicht. Ich bin mir nicht sicher ob du das Problem siehst: Der Hintergrund ist über 100% eines Bildschirmfensters und nicht über 100% des Dokumentes, wenn man also runter scrollt hören die roten Linien auf einmal auf.
Antwort 9
von rfb vom 23.03.2007, 13:14
body {background: url(templates/RedSilver/images/r.gif) repeat-y;}
sollte abhelfen
|
07121
07122
07123
07124
07125
07126
07127
07128
|
