nicht angemeldet
Div Container zentrieren
hallo erstmal!
ich habe das Problem, dass ich einen Div-Container komplett zentrieren will. Das einzige was ich aber hinbekomme ist, dass der Text zentriert wird. Ich habe gelesen, dass man es mit margin: 0px auto machen kann, aber auch das hilft bei mir nicht. Ich hoffe ihr könnt mir helfen.
Hier mein CSS-Code: (Es geht um den Bereich: #background)
/* CSS Document */
body {
text-align: left;
background-color: #5f5d59;
}
a:link, a:visited, a:hover {
color: #ffffff;
text-decoration: none;
font-family: Myriad Pro;
}
#background {
float: left;
padding: 0px;
width: 800px;
height: 640px;
margin: 0px auto;
background-color: black;
}
#main {
position: fixed;
float: left;
padding: 0px;
margin-left: 280px;
margin-top: 148px;
width: 409px;
height: 297px;
background: url(../images/main.jpg) no-repeat;
}
#navigation {
position: fixed;
float: left;
padding: 0px;
margin-left: -110px;
margin-top: 100px;
width: 100px;
}
#writing_down_under {
position: fixed;
float: left;
padding: 0px;
margin-left: 340px;
margin-top: 255px;
width: 192px;
height: 42px;
background: url(../images/writing_down_under.jpg) no-repeat;
}
#line_down {
position: fixed;
float: left;
padding: 0px;
margin-left: -477px;
margin-top: -598px;
width: 1px;
height: 640px;
background-color: #d98a0c;
}
Danke schonmal für die Hilfe!
gruß Johann
-
ich habe das Problem, dass ich einen Div-Container komplett zentrieren will. Das einzige was ich aber hinbekomme ist, dass der Text zentriert wird. Ich habe gelesen, dass man es mit margin: 0px auto machen kann, aber auch das hilft bei mir nicht. Ich hoffe ihr könnt mir helfen.
margin: 0 auto; (px ist bei 0 überflüssig, da 0 immer 0 ist unabhängig von der einheit) funktioniert nicht im quirks-mode
"komplett zentrieren" - meinst du damit vertikal und horizontal oder nur nur horizontal (margin: 0 auto; tut letzteres)
um eine seite auch vertikal zu zentrieren brauchst du ein zweites pseudoelement
---
[codel lang=html]
<html>
<head></head>
<body>
<div id="top"></div>
<div id="container">
<h1>ueberschrift</h1>
<p>text text text</p>
</div>
</body>
</html>
[/code]html, body { position: relative; height: 100%; } #top { width: 1px; height: 50%; margin-bottom: -200px; /* halbe Höhe des Containers */ float: left; } #container { position:relative; margin: 0 auto; height: 400px; width: 600px; clear: left; background: #FF0000; border: 1px solid #000000; }-
danke.. das es so einfach war hät ich auch jetzt nicht gedacht.. super!!
gruß Johann-
danke.. das es so einfach war hät ich auch jetzt nicht gedacht.. super!!
das ist eigentlich nicht so einfach, zumindest nicht naheliegend, dass man es so macht ;) die wirklich "einfache variante" funktioniert nämlich nicht so wie gewünscht
-
-
Hallo suit,
übrigens: http://forum.de.selfhtml.org/archiv/2006/1/t122049/#m785118
Auf Wiederlesen
Detlef--
- Wissen ist gut
- Können ist besser
- aber das Beste und Interessanteste ist der Weg dahin!-
Moin.
übrigens: http://forum.de.selfhtml.org/archiv/2006/1/t122049/#m785118
And als Antwort auf </archiv/2008/3/t168719/> auch dies hier.
Christoph
-
-
-
Hallo
FAQ?
--
selfcode: ie:% fl:( br:> va:) ls:& rl:( n4:~ ss:| de:> js:( ch:? mo:} zu:)
"Egal, ob ein Sandkorn oder ein Stein. Im Wasser sinken sie beide."-
FAQ?
mit verlaub, die unter http://de.selfhtml.org/navigation/faq.htm#mittig_zentrierte_inhalte gezeigte methode (mit position absolute) ist eine sehr dämliche
wenn der viewport kleiner wird als der seiteninhalt, verschwindet alles nach links oben ins nirvana (ohne scrollbalken) - ggf könnte man die von mir gepostete variante mal in die faq aufnehmen - diese ist wesentlich praktikabler
https://forum.selfhtml.org/?t=170478&m=1114446-
mit verlaub, die unter http://de.selfhtml.org/navigation/faq.htm#mittig_zentrierte_inhalte gezeigte methode (mit position absolute) ist eine sehr dämliche
nachtrag:
weil ichs garde sehe - die darunter beschriebene tabellenlösung sollte man ggf ebenfalls entfernen, da sie suggeriert, dass es ok ist nicht standardkonformes markup zu verwenden ;)-
nachtrag:
weil ichs garde sehe - die darunter beschriebene tabellenlösung sollte man ggf ebenfalls entfernen, da sie suggeriert, dass es ok ist nicht standardkonformes markup zu verwenden ;)Es wird doch gerade an der Version 9 gearbeitet - da werden solche Jugendsünden sicherlich getilgt werden.
--
selfcode: ie:% fl:( br:> va:) ls:& rl:( n4:~ ss:| de:> js:( ch:? mo:} zu:)
"Egal, ob ein Sandkorn oder ein Stein. Im Wasser sinken sie beide." -
mit verlaub, die unter http://de.selfhtml.org/navigation/faq.htm#mittig_zentrierte_inhalte gezeigte methode (mit position absolute) ist eine sehr dämliche
nachtrag:
weil ichs garde sehe - die darunter beschriebene tabellenlösung sollte man ggf ebenfalls entfernen, da sie suggeriert, dass es ok ist nicht standardkonformes markup zu verwenden ;)Was genau ist denn an der Tabellenlösung nicht OK?
Pete
-
Was genau ist denn an der Tabellenlösung nicht OK?
die frage ist jetzt nicht dein ernst ;)
-
Was genau ist denn an der Tabellenlösung nicht OK?
die frage ist jetzt nicht dein ernst ;)Auch wenns peinlich ist, doch!
Pete
-
Hallo.
Was genau ist denn an der Tabellenlösung nicht OK?
die frage ist jetzt nicht dein ernst ;)Auch wenns peinlich ist, doch!
Tabellen sollten tabellarischen Daten vorbehalten bleiben, Stichwort: Semantik. Als gestalterische Hilfskonstruktion sind sie zweckentfremdet eingesetzt und bei späteren Änderungen unhandlich.
MfG, at-
Tabellen sollten tabellarischen Daten vorbehalten bleiben, Stichwort: Semantik. Als gestalterische Hilfskonstruktion sind sie zweckentfremdet eingesetzt und bei späteren Änderungen unhandlich.
Ja das ist klar und auch Ansichtssache. Aber unter falsch verstehe ich falsch im Sinne von fehlerhaft, und Fehler kann ich keine erkennen.
Pete
-
Hallo.
Ja das ist klar und auch Ansichtssache.
Das ist keine Ansichtssache, sondern Semantik.
Aber unter falsch verstehe ich falsch im Sinne von fehlerhaft, und Fehler kann ich keine erkennen.
Dann hast du offenbar entweder ein Verständnis- oder ein Erkenntnisproblem.
Ein Satz, der aufgrund seines Aufbaus keinen Sinn ergibt, ist auch dann fehlerhaft, wenn sein Aufbau syntaktisch korrekt ist. So funktioniert Kommunikation, ganz unabhängig von der gewählten Sprache.
MfG, at-
Hallo,
Ja das ist klar und auch Ansichtssache.
Das ist keine Ansichtssache, sondern Semantik.
Aber unter falsch verstehe ich falsch im Sinne von fehlerhaft, und Fehler kann ich keine erkennen.
Dann hast du offenbar entweder ein Verständnis- oder ein Erkenntnisproblem.
Ein Satz, der aufgrund seines Aufbaus keinen Sinn ergibt, ist auch dann fehlerhaft, wenn sein Aufbau syntaktisch korrekt ist. So funktioniert Kommunikation, ganz unabhängig von der gewählten Sprache.Du betrachtest das Innenleben/Gerüst einer Webseite als Kommunikation?
Für mich ist Kommunikation das was rauskommt, nicht was drin steckt.Oder mathematisch:
Wenn a+b=c ergibt, dann ist doch egal ob diese Aussage auf einem Papier steht was vom Aussehen eher in den Papierkorb gehört. Natürlich liegt der Fall bei Webseiten anders, denn es muss gewährleistet sein, dass alle Systeme/Nutzer die gleiche Information in gewünschter Verpackunge erhalten.Also stellt sich nur die Frage ist der Code Valide?
Pete
-
Hallo.
Du betrachtest das Innenleben/Gerüst einer Webseite als Kommunikation?
Ich betrachte HTML als Sprache.
Für mich ist Kommunikation das was rauskommt, nicht was drin steckt.
Dann empfehle ich dir das TXT-Format.
Oder mathematisch:
Wenn a+b=c ergibt, dann ist doch egal ob diese Aussage auf einem Papier steht was vom Aussehen eher in den Papierkorb gehört.Vom Aussehen war bisher noch gar nicht die Rede, was daran liegen könnte, dass HTML ja nicht für die Darstellung verantwortlich ist.
Natürlich liegt der Fall bei Webseiten anders, denn es muss gewährleistet sein, dass alle Systeme/Nutzer die gleiche Information in gewünschter Verpackunge erhalten.
Das ist nicht zu gewährleisten, da die Unterstützung der Verpackung namens CSS recht unterschiedlich ausfällt.
Also stellt sich nur die Frage ist der Code Valide?
Und damit stellt sich die Frage, ob du in absehbarer Zeit einen Semantik-Validator veröffentlichst, oder ob ich auch weiterhin meinen Kopf benutzen muss.
MfG, at -
Hi,
Also stellt sich nur die Frage ist der Code Valide?
Nein.
Auch *hoechst* *unsinniger* Code kann technisch valide sein.
Validitaet ist lediglich *eine* Mindestanforderung an "guten" Code - alleine macht sie aber noch lange keinen.
MfG ChrisB
--
"The Internet: Technological marvel of marvels - but if you don't know *what* you're lookin' for on the Internet, it is nothing but a time-sucking vortex from hell."
-
-
-
-
-
-
-
-
-
Hallo suit
wenn der viewport kleiner wird als der seiteninhalt, verschwindet alles nach links oben ins nirvana (ohne scrollbalken)
Also bei mir (Firefox 2.0.0.14) kommen in diesen Fall Scrollbalken.
--
selfcode: ie:% fl:( br:> va:) ls:& rl:( n4:~ ss:| de:> js:( ch:? mo:} zu:)
"Egal, ob ein Sandkorn oder ein Stein. Im Wasser sinken sie beide."-
Also bei mir (Firefox 2.0.0.14) kommen in diesen Fall Scrollbalken.
bei mir kommt unter jedem browser auch ff 2.0.0.14 ein scrollbalken, aber der scrollbalken erlaubt es mir nur nach rechts und unten zu scrollen, nicht aber den unsichtbaren bereich links und oben wieder in den viewport zu rücken ;)
-
Also bei mir (Firefox 2.0.0.14) kommen in diesen Fall Scrollbalken.
bei mir kommt unter jedem browser auch ff 2.0.0.14 ein scrollbalken, aber der scrollbalken erlaubt es mir nur nach rechts und unten zu scrollen, nicht aber den unsichtbaren bereich links und oben wieder in den viewport zu rücken ;)
Oh, äh Verzeihung. Hätte den Viewport(ja liebe Firefox Rechtschreibkontrolle, das heißt so und nicht 'Viehexport') noch kleiner machen sollen ;-)
Also ist das Beispiel suboptimal. (Deines konnte ich jetzt noch nicht testen)
--
selfcode: ie:% fl:( br:> va:) ls:& rl:( n4:~ ss:| de:> js:( ch:? mo:} zu:)
"Egal, ob ein Sandkorn oder ein Stein. Im Wasser sinken sie beide."
-
-
-
-