CSS Layout - Problem

Chr!s · 13.09.2005, 18:25

Hallo,
ich bin gerade an einem Design. Nun, wie man es nunmal machen sollte hab ich mein Design mit CSS erstellt. (Doctype ist xHTML Strict). Nur jetzt hab ich ein Problem:
Rechts in der Contentbox ist der Abschluss der Contentbox gaaaanz unten. Nun, dieser soll aber dierkt an den Text angefügt werden. (Hier ist zu beachten, dass die größe der Box ja variiert, je nach Inhalt!)..
Geht sowas mit CSS überhaupt? Und wenn ja, wie?

http://sag-ich-dir.net/kunden/~11a-wgn.de

http://sag-ich-dir.net/kunden/~11a-wgn.de/lib/style.css

Igi · 13.09.2005, 18:45

ähm ja, erstmal: div-suppe
und elemente absolout zu positionieren ist auch pfui^^
versuch das mal anders zu machen...

und nu zur lösung:
verschieb den div-contentfooter unten in div-contentbit rein und lösch die left:25% aus #contentfooter

Gruß Igi

Chr!s · 13.09.2005, 18:49

Jau, Div-suppe, aber halt mein erstes Div-Layout mit einem Photoshop-Designten Layout (nicht ganz einfach).

Uff, auf die Lösung bin ich nich gekommen, danke!

Ja ich weiß, Elemente absolut zu positionieren ist eigentlich tabu, das war aber eigentlich nur als Platzhalter gedacht.

Aber wenn wir schon mal dabei sind - wie positionier ich das besser? (bin noch neu im DIV-geschäft ^^)

DER_Brain · 13.09.2005, 19:30

du könntest z.b. mit margin (px angaben) und float arbeiten (sind zwei Paar Schuhe, aber mit denen kannst du viel anstellen

)

mfg Andi

PS: Was würde ich dafür geben, grafisch begabt zu sein

Chr!s · 13.09.2005, 19:52

Margin und px-Angaben? Ist doch nicht gut wenn der User verschiedene Bildschirmauflösungen hat. float, hatte ich bereits versucht, auch auf css4you.de nachgelesen, nur leider nichts hinbekommen. margin 0: auto; zentriert mir ja theoretisch alles, aber es ging nicht, ich hab ein Master-div erstellt und diesem margin 0: auto gegeben, das Layout hat sich trotzdem nicht in die MItte verschoben.

Ben · 13.09.2005, 20:05

Layout in der Mitte:

Code:

body {
    text-align:center; /* IE sucks! */
}

#container {
    margin:0 auto;
    width:800px;
    border:1px solid #000;
}

Code:

<body>

   <div id="container">
         Demotext.
   </div>

</body>

Teste das mal aus.
Vertikal und horizontal zentriert:

http://scholz-webdesign.de/css/demo/zentrieren/

Grüße Ben.

Chr!s · 13.09.2005, 20:22

Perfekt.

.. dachte ich, bevor ich mir das neue Lay im InternetExplorer angesehen habe. Firefox & Co okay, nur der IE zerhackt das Layout

http://sag-ich-dir.net/kunden/~11a-wgn.de/

Ben · 13.09.2005, 20:25

Der IE hat Probleme mit margin. Ich hatte da mal eine Quelle ... weiß gerade nicht mehr wo. Such eventuell mal auf www.xhtmlforum.de .. die haben sicher was dazu.

Grüße Ben.

Chr!s · 13.09.2005, 21:15

Hab mich mal dort registriert und meine Frage gestellt - und gleich auch eine Antwort bekommen.

Code:

body {
    text-align:center; /* IE sucks! */
}

Genau das war das, was mir mein Layout zerhackt hatte - ohne das zentriert der IE schön brav, und das Layout sieht (endilch) genauso aus wie im IE

Ben · 13.09.2005, 23:16

Zitat:

Zitat von Chr!s

Hab mich mal dort registriert und meine Frage gestellt - und gleich auch eine Antwort bekommen.

Code:

body {
    text-align:center; /* IE sucks! */
}

Genau das war das, was mir mein Layout zerhackt hatte - ohne das zentriert der IE schön brav, und das Layout sieht (endilch) genauso aus wie im IE

Äh.
Das habe ich jetzt nicht verstanden.
Ich war immer der Ansicht, dass der IE im Element, welches dem zu zentrierenden übergeordnet ist, ein text-align:center; braucht.

So mache ich das bei jeder Seite, die ich zentrieren will und es klappt immer.

Wo ist also mein Denkfehler?

Chr!s · 13.09.2005, 23:27

Ich auch - ein überdiv, das zentrieren mit margin: 0 auto; und text-align: center.
Daher wundere ich mich auch so über die Funktionsweise des CSS auf meiner Seite..

DER_Brain · 14.09.2005, 16:54

mit margin und pixelangaben meinte ich soetwas in der art:

Code:

  .containter{
    margin: 0px auto; /*zentriert den container (px kann man natürlich weglassen..) */
    margin-bottom: 10px; /* Hebt den Container etwas an und lässt ihn vom unteren rand entfernen... */
  }

aber in deinem fall reicht ja wirklich das erste mit margin..
gruß
Andi

13.09.2005, 18:25	Nach oben #1
Chr!s Erfahrener Benutzer Registriert seit: 04.09.2005 Ort: Nürnberg Beiträge: 561	CSS Layout - Problem Hallo, ich bin gerade an einem Design. Nun, wie man es nunmal machen sollte hab ich mein Design mit CSS erstellt. (Doctype ist xHTML Strict). Nur jetzt hab ich ein Problem: Rechts in der Contentbox ist der Abschluss der Contentbox gaaaanz unten. Nun, dieser soll aber dierkt an den Text angefügt werden. (Hier ist zu beachten, dass die größe der Box ja variiert, je nach Inhalt!).. Geht sowas mit CSS überhaupt? Und wenn ja, wie? http://sag-ich-dir.net/kunden/~11a-wgn.de http://sag-ich-dir.net/kunden/~11a-wgn.de/lib/style.css __________________ http://www.ChrisDiary.De

13.09.2005, 18:45	Nach oben #2
Igi Benutzer Registriert seit: 07.05.2005 Ort: nähe Münster Beiträge: 33	ähm ja, erstmal: div-suppe und elemente absolout zu positionieren ist auch pfui^^ versuch das mal anders zu machen... und nu zur lösung: verschieb den div-contentfooter unten in div-contentbit rein und lösch die left:25% aus #contentfooter Gruß Igi __________________ http://redRogi.de

13.09.2005, 18:49	Nach oben #3
Chr!s Erfahrener Benutzer Registriert seit: 04.09.2005 Ort: Nürnberg Beiträge: 561	Jau, Div-suppe, aber halt mein erstes Div-Layout mit einem Photoshop-Designten Layout (nicht ganz einfach). Uff, auf die Lösung bin ich nich gekommen, danke! Ja ich weiß, Elemente absolut zu positionieren ist eigentlich tabu, das war aber eigentlich nur als Platzhalter gedacht. Aber wenn wir schon mal dabei sind - wie positionier ich das besser? (bin noch neu im DIV-geschäft ^^) __________________ http://www.ChrisDiary.De Geändert von Chr!s (13.09.2005 um 18:59 Uhr).

13.09.2005, 19:30	Nach oben #4
DER_Brain Benutzer Registriert seit: 18.08.2005 Ort: Österreich Beiträge: 32	du könntest z.b. mit margin (px angaben) und float arbeiten (sind zwei Paar Schuhe, aber mit denen kannst du viel anstellen ) mfg Andi PS: Was würde ich dafür geben, grafisch begabt zu sein __________________ Just because I am super.

13.09.2005, 19:52	Nach oben #5
Chr!s Erfahrener Benutzer Registriert seit: 04.09.2005 Ort: Nürnberg Beiträge: 561	Margin und px-Angaben? Ist doch nicht gut wenn der User verschiedene Bildschirmauflösungen hat. float, hatte ich bereits versucht, auch auf css4you.de nachgelesen, nur leider nichts hinbekommen. margin 0: auto; zentriert mir ja theoretisch alles, aber es ging nicht, ich hab ein Master-div erstellt und diesem margin 0: auto gegeben, das Layout hat sich trotzdem nicht in die MItte verschoben. __________________ http://www.ChrisDiary.De

13.09.2005, 20:05	Nach oben #6
Ben Erfahrener Benutzer Registriert seit: 02.12.2004 Ort: Remagen Beiträge: 4.619	Layout in der Mitte: Code: body { text-align:center; /* IE sucks! / } #container { margin:0 auto; width:800px; border:1px solid #000; } Code: <body> <div id="container"> Demotext. </div> </body> Teste das mal aus. Vertikal und horizontal zentriert: http://scholz-webdesign.de/css/demo/zentrieren/ Grüße Ben. __________________ Mehr TuS Koblenz geht nicht ...* Aktuell ... - Neue Gegner für die TuS: 1.FC Nürnberg - 5 neue Gegner 2008/09 - Informationsveranstaltung für Mitglieder - Förderkasse füllt sich - B-Jugend Rheinlandpokalfinale terminiert - A-Jugend I gewinnt Rheinlandpokal

13.09.2005, 20:22	Nach oben #7
Chr!s Erfahrener Benutzer Registriert seit: 04.09.2005 Ort: Nürnberg Beiträge: 561	Perfekt. .. dachte ich, bevor ich mir das neue Lay im InternetExplorer angesehen habe. Firefox & Co okay, nur der IE zerhackt das Layout http://sag-ich-dir.net/kunden/~11a-wgn.de/ __________________ http://www.ChrisDiary.De

13.09.2005, 20:25	Nach oben #8
Ben Erfahrener Benutzer Registriert seit: 02.12.2004 Ort: Remagen Beiträge: 4.619	Der IE hat Probleme mit margin. Ich hatte da mal eine Quelle ... weiß gerade nicht mehr wo. Such eventuell mal auf www.xhtmlforum.de .. die haben sicher was dazu. Grüße Ben. __________________ Mehr TuS Koblenz geht nicht ... Aktuell ... - Neue Gegner für die TuS: 1.FC Nürnberg - 5 neue Gegner 2008/09 - Informationsveranstaltung für Mitglieder - Förderkasse füllt sich - B-Jugend Rheinlandpokalfinale terminiert - A-Jugend I gewinnt Rheinlandpokal

13.09.2005, 21:15	Nach oben #9
Chr!s Erfahrener Benutzer Registriert seit: 04.09.2005 Ort: Nürnberg Beiträge: 561	Hab mich mal dort registriert und meine Frage gestellt - und gleich auch eine Antwort bekommen. Code: body { text-align:center; /* IE sucks! / } Genau das war das, was mir mein Layout zerhackt hatte - ohne das zentriert der IE schön brav, und das Layout sieht (endilch) genauso aus wie im IE __________________ http://www.ChrisDiary.De*

13.09.2005, 23:27	Nach oben #11
Chr!s Erfahrener Benutzer Registriert seit: 04.09.2005 Ort: Nürnberg Beiträge: 561	Ich auch - ein überdiv, das zentrieren mit margin: 0 auto; und text-align: center. Daher wundere ich mich auch so über die Funktionsweise des CSS auf meiner Seite.. __________________ http://www.ChrisDiary.De

14.09.2005, 16:54	Nach oben #12
DER_Brain Benutzer Registriert seit: 18.08.2005 Ort: Österreich Beiträge: 32	mit margin und pixelangaben meinte ich soetwas in der art: Code: .containter{ margin: 0px auto; /zentriert den container (px kann man natürlich weglassen..) / margin-bottom: 10px; /* Hebt den Container etwas an und lässt ihn vom unteren rand entfernen... */ } aber in deinem fall reicht ja wirklich das erste mit margin.. gruß Andi __________________ Just because I am super.

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Themen-Optionen
Druckbare Version zeigen Diese Seite per E-Mail verschicken

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Bildwechsel mit CSS Problem	jjelliss	HTML, XML und CSS	19	17.09.2007 01:36
[CSS] Div + CSS + IE6 -> Problem	Binary	HTML, XML und CSS	5	14.02.2007 16:24
Suche MAC-Webdesigner wegen einem CSS Problem.	Sebastian	Gesuche	6	14.02.2007 14:02
CSS layout	$traight-$hoota	HTML, XML und CSS	8	25.04.2006 16:02
CSS Problem: Div hängt aus dem MasterDiv heraus	Chr!s	HTML, XML und CSS	9	01.03.2006 13:36