CSS Problem / Frage.. ich blick da nicht durch
Steven
- css
0 Ingo Turski-1 Steven0 Ingo Turski-1 Steven1 Ingo Turski0 Steven0 Ingo Turski0 Steven
Hi!
Ich bastel gerade an einer etwas wichtigeren Seite und arbeite mich ein bisschen mit CSS ein. Allerdings kapier ich da was nicht so ganz. Ich hab den Anfang mal hochgeladen -> http://www.sfu-ev.de/privat/darking/ihk/index2.htm
Also ich habe folgendes Problem:
div#seite {
border: 1px solid blue;
text-align: left; /* Seiteninhalt wieder links ausrichten */
margin: 0; /*standardkonforme horizontale Zentrierung */
padding: 0;
background: #3b664a url(design/baum.jpg) no-repeat;
width: 800px;
height: 600px;
}
---------------------
das ist sozusagen meine grenze für die Seite in der sich alles abspielen soll
--------------------
-------------------
die Schilder...
-------------------
menu.schilder {
border: 1px solid black;
position: relative;
width: 135px;
margin: 0;
padding: 0;
top:250px;
left: 0;
}
-----------------
und der inhalt... seht ja alles da
-----------------
.inhalt {
position:relative;
border: 1px solid red;
left: 140px;
width:605px;
height:410px;
margin: 0;
padding: 0;
font-size: 16px;
font-weight:normal;
color:#FFFFFF;
float: left;
overflow:auto;
text-align:left;
}
Ich hab auch die Rahmen drumherum damit es offensichtlichter ist. Mein Problem: Warum setzt er den .inhalt so einfach mitten hin? "left" habe ich ja auf 140 und das funktioniert auch. aber wenn ich bei top: 0px eingebe dann hängt er trotzdem so in der Mitte. Nur wenn ich position: absolute macht geht das richtig. Sobald ich relative nehme klatscht er es da unten hin. bei absolute gibts aber probleme wenn man dann die Fenstergröße ändert, weil der Teil dann ja stehen bleibt.
Hi,
margin: 0; /*standardkonforme horizontale Zentrierung */
das zentriert überhaupt nichts - es bewirkt bei einem DIV außerdem absolut gar nichts.
height: 600px;
und was, wenn mein Fenster nicht so hoch ist?
position: relative;
top:250px;
left: 0;
margin-top: 250px wäre sinnvoller.
overflow:auto;
igitt.. seiteninterne Scrollbalken - dazu noch das Windows-babyblau in grün...
Abgesehen davon kann ich in Firefox/Mozilla mein Scrollrad nicht mehr nutzen.
Das geht nun wirklich viel eleganter.
freundliche Grüße
Ingo
margin: 0; /*standardkonforme horizontale Zentrierung */
das zentriert überhaupt nichts - es bewirkt bei einem DIV außerdem absolut gar nichts.
Das heist im original "margin: 0 auto; /*standardkonforme horizontale Zentrierung */" und nur copy & paste von dieser Seite hier... damit hab ich geübt und gebastelt
height: 600px;
und was, wenn mein Fenster nicht so hoch ist?
Das ganze soll in einem Fenster dieser Größe ablaufen.. bei dem Link mal das index2.htm durch index.htm ersetzen
position: relative;
top:250px;
left: 0;
margin-top: 250px wäre sinnvoller.
Kann ich ja noch ändern, bin ja wie gesagt noch grün. Warum ist das besser?
overflow:auto;
igitt.. seiteninterne Scrollbalken - dazu noch das Windows-babyblau in grün...
Abgesehen davon kann ich in Firefox/Mozilla mein Scrollrad nicht mehr nutzen.
Das geht nun wirklich viel eleganter.
Stimmt ja?! Das hatte ich vor kurzem doch erst ausprobiert.. Mist ;)
Danke für die tollen Tipps.. wo gehts um mein Problem?? Ich habe jetz allerdings selber eine Lösung gefunden, verstehe trotzdem den komischen Unterschied zwischen absolute und relative nicht!?
Hi,
height: 600px;
und was, wenn mein Fenster nicht so hoch ist?Das ganze soll in einem Fenster dieser Größe ablaufen..
und woher willst Du wissen, daß das Fenster so hoch ist? Oder kennst Du die Bildschirmgrößen und Browsereinstellungen aller Besucher?
position: relative;
top:250px;
left: 0;
margin-top: 250px wäre sinnvoller.Kann ich ja noch ändern, bin ja wie gesagt noch grün. Warum ist das besser?
weil Du doch einen Abstand definieren willst. Außerdem kann man mit position wunderbar Elemente aus dem sichtbaren Bereich schieben.
verstehe trotzdem den komischen Unterschied zwischen absolute und relative nicht!?
wieso nicht? absolute ist aus dem Elementfluß genommen an die angegebenen Koordinaten platziert, relative nur um die Positionsangaben versetzt. Meist wird positon:relative aber ohne weitere Angaben zur Position verwendet, um hieran andere Elemente absolute auszurichten.
freundliche Grüße
Ingo
und woher willst Du wissen, daß das Fenster so hoch ist? Oder kennst Du die Bildschirmgrößen und Browsereinstellungen aller Besucher?
Ich habs doch vorher geschrieben? man soll auf einen Link klicken, der öffnet dann ein Fenster 800*600.. und dann wird das wohl so sein oder? Oder soll das jetz eine Anspielung darauf sein das manche noch mit Auflösungen unter 600er Höhe fahren?
weil Du doch einen Abstand definieren willst. Außerdem kann man mit position wunderbar Elemente aus dem sichtbaren Bereich schieben.
Tja dann werd ich das mal ändern.
wieso nicht?
Hmm..? Zu dumm? Oder vielleicht weil ich das erst seit ein paar Tagen mache?
»»absolute ist aus dem Elementfluß genommen an die angegebenen Koordinaten platziert
Das ist mir schon aufgefallen
»»relative nur um die Positionsangaben versetzt.
Deshlab verstehe ich trotzdem nicht, warum er meinen text, rotes kästchen, da mitten in die Mitte packt, wenn ich top: 0px habe.. woher nimmt er denn diese 0 Grenze??
Hat jeder mal angefangen oder?
Hi,
Ich habs doch vorher geschrieben? man soll auf einen Link klicken, der öffnet dann ein Fenster 800*600.. und dann wird das wohl so sein oder? Oder soll das jetz eine Anspielung darauf sein das manche noch mit Auflösungen unter 600er Höhe fahren?
nicht nur. Wenn ich den Opera (mit Werbung) nutze, habe ich z.B. maximal 574px innere Fensterhöhe zur Verfügung. Wirklich nur zufällig (habe ich gerade nachgemessen) habe ich exakt dieselbe Höhe im Firefox (mit Tableiste) - und meine Toolbars lasse ich mir von Javascript auch nicht nehmen. Also nix mit 600px. Und ich bin sicher nicht der Einzige...
»»relative nur um die Positionsangaben versetzt.
Deshlab verstehe ich trotzdem nicht, warum er meinen text, rotes kästchen, da mitten in die Mitte packt, wenn ich top: 0px habe.. woher nimmt er denn diese 0 Grenze??
Vielleicht liegt es an der sehr merkwürdigen HTML-Auszeichnung. Informiere Dich doch bitte, wie man Listen auszeichnet und wie sonstigen Inhalt. <menu> solltest Du nicht verwenden.
Hat jeder mal angefangen oder?
sicher - wengleich ich mich da noch nicht getraut hatte, hier Nachfragen zu stellen. ;-)
freundliche Grüße
Ingo
nicht nur. Wenn ich den Opera (mit Werbung) nutze, habe ich z.B. maximal 574px innere Fensterhöhe zur Verfügung. Wirklich nur zufällig (habe ich gerade nachgemessen) habe ich exakt dieselbe Höhe im Firefox (mit Tableiste) - und meine Toolbars lasse ich mir von Javascript auch nicht nehmen. Also nix mit 600px. Und ich bin sicher nicht der Einzige...
Er öffnet ja auch kein neues Fenster mit Werbung oder Taskleiste, sondern ein PopUp, ohne lästige Bars o.ä. auch in Opera.
Ich hasse ToolBars.. und da bin ich nicht der einzige.
Ich wollte ürsprünglich das ganze mittig in einem "normalen" Browser Fenster ausrichten. Aber irgendwie sieht das sehr bescheiden aus da der Baum ja unten mal aufhört..
Vielleicht liegt es an der sehr merkwürdigen HTML-Auszeichnung. Informiere Dich doch bitte, wie man Listen auszeichnet und wie sonstigen Inhalt. <menu> solltest Du nicht verwenden.
"Erläuterung:
Eine Verzeichnisliste leiten Sie mit <dir> ein und beenden sie durch </dir> (dir = directory = Verzeichnis).
-> <menu> leitet eine Menüliste ein, </menu> beendet die Menüliste. Mit <li> beginnt in beiden Listentypen ein neuer Punkt innerhalb der Liste (li = list item = Listeneintrag). Das End-Tag </li> am Ende eines Listeneintrags ist nicht zwingend erforderlich, aber zu empfehlen."
Nur deshlab hab ich menu verwendet..
Hat jeder mal angefangen oder?
sicher - wengleich ich mich da noch nicht getraut hatte, hier Nachfragen zu stellen. ;-)
Für was ist das Forum dann bitte da? Kann ja keiner Antworten wenn keiner fragt. Mein Ego hält es aus auch mal totale Anfängerfrage zu stellen.
und nochwas zu der Sache das ich praktisch das Menü und den Baum "fixed" machen soll.. kann ich den Text dann trotzden so eingrenzen, dass er "im" Baum bleibt?
Vielleicht sollte ich auch mal ne Runde schlafen.. manchmal sieht man den Wald vor lauter Tags nicht mehr ;)
Hi,
Er öffnet ja auch kein neues Fenster mit Werbung oder Taskleiste, sondern ein PopUp, ohne lästige Bars o.ä. auch in Opera.
nicht in meinem Opera. Und mit Werbung meine ich die in der werbefinanzierten Opera-Version integrierte.
Ich hasse ToolBars.. und da bin ich nicht der einzige.
Och... Meine Menüleiste, die Iconleiste mit der Adresszeile und die Webdeveloper Toolbar sind mir unverzichtbar. Weitere wären mir (außer der Statuszeile, wo auch noch einige Tools Plstz finden) aber auch zuviel.
Nur deshlab hab ich menu verwendet..
Lies bitte von Anfang:
"Verzeichnis- und Menülisten werden in der Praxis kaum verwendet und sind auch mittlerweile als deprecated gekennzeichnet, sollen also künftig aus dem HTML-Standard entfallen. Sie werden von den heutigen Browsern entweder nicht mehr oder nicht anders dargestellt als gewöhnliche Aufzählungslisten."
und zu diesem Thema die neue Seite http://de.selfhtml.org/css/layouts/navigationsleisten.htm. Eine passendere Auszeichnung gibt es z.Z. noch nicht.
und nochwas zu der Sache das ich praktisch das Menü und den Baum "fixed" machen soll.. kann ich den Text dann trotzden so eingrenzen, dass er "im" Baum bleibt?
Natürlich. Setze ihn in ein DIV (bitte keine UL) mit fester Breite.
freundliche Grüße
Ingo
Hi,
nicht in meinem Opera. Und mit Werbung meine ich die in der werbefinanzierten Opera-Version integrierte.
Ich hab schon verstanden was sie bei Opera meinten.. und mein Opera macht ein Fenster ohne Werbung etc. auf.. bei meinem Opera sieht es genauso aus wie bei IE und Moz.. genauso wie ich es wollte..
Nur deshlab hab ich menu verwendet..
Lies bitte von Anfang:"Verzeichnis- und Menülisten werden in der Praxis kaum verwendet und sind auch mittlerweile als deprecated gekennzeichnet, sollen also künftig aus dem HTML-Standard entfallen. Sie werden von den heutigen Browsern entweder nicht mehr oder nicht anders dargestellt als gewöhnliche Aufzählungslisten."
und zu diesem Thema die neue Seite http://de.selfhtml.org/css/layouts/navigationsleisten.htm. Eine passendere Auszeichnung gibt es z.Z. noch nicht.
Ok dann kommt es wieder weg.. das man auch überall noch 3x nachlesen muß :)
und nochwas zu der Sache das ich praktisch das Menü und den Baum "fixed" machen soll.. kann ich den Text dann trotzden so eingrenzen, dass er "im" Baum bleibt?
Natürlich. Setze ihn in ein DIV (bitte keine UL) mit fester Breite.
Ich rede aber von der Höhe, der Text soll weder über die Baumkrone laufen, noch über die Wurzel. Der Text soll sich nur innerhalb dieser Grenzen abspielen. (also Krone und Wurzel) Ansonsten sieht das nämlich... aus
Hi,
Ich rede aber von der Höhe, der Text soll weder über die Baumkrone laufen, noch über die Wurzel. Der Text soll sich nur innerhalb dieser Grenzen abspielen. (also Krone und Wurzel) Ansonsten sieht das nämlich... aus
auch das geht, ist aber etwas komplizierter. Hast Du Dir die hier angesprochene Seite http://www.rammstein.de/ einmal angesehen? Wenn nicht, dann tu das mal - die realisiert das nämlich.
freundliche Grüße
Ingo