| Autor |
Nachricht |
elPadre
Threadersteller
Dabei seit: 07.12.2005
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 07.12.2005 18:39
Titel [CSS] Seite horizontal zentrieren |
  |
|
Hallo Leute ich hoffe ihr könnt mir helfen:
Mein Problem liegt darin das ich meien Seite Zentriere (horizontal) möchte .
Die dachte ich wie es auch erst den anschein gemacht hat funktioniert in dem ich den body:
<body style="text-align: center"> center zuweise IE alles klar nur jetzt habe ich es im Firefox Probiert
und der mag das gleich garnicht.
1.Frage Welche möglichkeit habe ich noch meine komplette Seite in dem root div Center zu Positionieren.
2.Frage Wie nehme ich optimal die Positionierung meiner <div id="box"> vor das es nicht nur im Internet Explorer sondern auch im Firefox richtig funktioniert ?
Danke für eure Hilfe anbei der Komplette Code.
| Code: | <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Berchtesgadener Land Tourismus GmbH - Berchtesgaden, Bad Reichenhall, Laufen</title>
<link rel="stylesheet" type="text/css" href="./css/struktur.css">
<link rel="stylesheet" type="text/css" href="./css/strukturstyle.css">
<script language="JavaScript" src="./javascript/meta.js"></script>
</head>
<body style="text-align: center">
<body align="center"></body>
<div id="root">
<!----------kopf---------->
<div id="top01"></div>
<!----------kopf---------->
<!----------navi---------->
<div id="navia1"><a href="" class="metaa" onMouseOver="javascript:Roll('ma01',1)" onMouseOut="javascript:Roll('ma01',0)"><img id="ma01" name="ma01" src="./style/bu_angebote_do.gif" onload="Rollover(this,'bu_angebote_up.gif')" border="0" alt="Wir über uns" title="Wir über uns"></a></div>
<div id="navia2"><a href="" class="metaa" onMouseOver="javascript:Roll('ma02',1)" onMouseOut="javascript:Roll('ma02',0)"><img id="ma02" name="ma02" src="./style/bu_natur_do.gif" onload="Rollover(this,'bu_natur_up.gif')" border="0" alt="Die Kritierien" title="Die Kritierien"></a></div>
<div id="navia3"><a href="" class="metaa" onMouseOver="javascript:Roll('ma03',1)" onMouseOut="javascript:Roll('ma03',0)"><img id="ma03" name="ma03" src="./style/bu_sport_do.gif" onload="Rollover(this,'bu_sport_up.gif')" border="0" alt="Die Vermieterakademie" title="Die Vermieterakademie"></a></div>
<div id="navia4"><a href="" class="metaa" onMouseOver="javascript:Roll('ma04',1)" onMouseOut="javascript:Roll('ma04',0)"><img id="ma04" name="ma04" src="./style/bu_gesundheit_do.gif" onload="Rollover(this,'bu_gesundheit_up.gif')" border="0" alt="Gastgeber werden" title="Gastgeber werden"></a></div>
<div id="navia5"><a href="" class="metaa" onMouseOver="javascript:Roll('ma05',1)" onMouseOut="javascript:Roll('ma05',0)"><img id="ma05" name="ma05" src="./style/bu_kultur_do.gif" onload="Rollover(this,'bu_kultur_up.gif')" border="0" alt="Initiatoren" title="Initiatoren"></a></div>
<div id="navia6"><a href="" class="metaa" onMouseOver="javascript:Roll('ma06',1)" onMouseOut="javascript:Roll('ma06',0)"><img id="ma06" name="ma06" src="./style/bu_sport_do.gif" onload="Rollover(this,'bu_sport_up.gif')" border="0" alt="Partner" title="Partner"></a></div>
<div id="navia7"><a href="" class="metaa" onMouseOver="javascript:Roll('ma07',1)" onMouseOut="javascript:Roll('ma07',0)"><img id="ma07" name="ma07" src="./style/bu_gesundheit_do.gif" onload="Rollover(this,'bu_gesundheit_up.gif')" border="0" alt="Kontakt" title="Kontakt"></a></div>
<div id="navia8"><a href="" class="metaa" onMouseOver="javascript:Roll('ma08',1)" onMouseOut="javascript:Roll('ma08',0)"><img id="ma08" name="ma08" src="./style/bu_kultur_do.gif" onload="Rollover(this,'bu_kultur_up.gif')" border="0" alt="Impressum" title="Impressum"></a></div>
<!----------navi---------->
<!----------image bereich---------->
<div id="image"></div>
<!----------image bereich---------->
<!----------mittlerer bereich---------->
<div id="content">
<div id="box"><br><br><br>sdfgdsfg</div>
</div>
<!----------mittlerer bereich---------->
<!----------fussbereich---------->
<div id="footer1">footer1</div>
<div id="footer2">footer2</div>
<!----------fussbereich---------->
</div>
</body>
</html> |
| Code: | /*
###############################################
### Seitenstruktur Website ALPINE GASTGEBER ###
###############################################
*/
/*----------KOPFBEREICH----------*/
#root{
width:780px;
height:208px;
background:#FF7F00;
}
#top01 {background:#CC3300; clear: both; width:780px; height:23px;}
#navia1 {background:#000000; float: left; width:70px; height:20px;}
#navia2 {background:#000033; float: left; width:70px; height:30px;}
#navia3 {background:#000066; float: left; width:70px; height:30px;}
#navia4 {background:#000099; float: left; width:70px; height:30px;}
#navia5 {background:#0000CC; float: left; width:70px; height:30px;}
#navia6 {background:#0000FF; float: left; width:70px; height:30px;}
#navia7 {background:#330000; float: left; width:70px; height:30px;}
#navia8 {background:#330033; float: left; width:70px; height:30px;}
#image {background:#00CC00; clear: both; width:780px; height:135px;}
/*----------MITTLERER BEREICH----------*/
#content {background:#FFFF66; float: left; width:780px; height:300px; z-index:1;}
#box {background-color:#FF6600; position:relative; top:-30px; left:280px; height:200px; width:190px; z-index:2;}
/*----------FUSSBEREICH----------*/
#footer1 {background:#CC3399; clear: both; width:780px; height:60px;}
#footer2 {background:#CC0000; clear: both; width:780px; height:25px;} |
Zuletzt bearbeitet von shakadi am Mi 21.12.2005 21:57, insgesamt 1-mal bearbeitet
|
|
| |
  |
 |
gtz
Dabei seit: 15.04.2002
Ort: -
Alter: 48
Geschlecht: 
|
Verfasst Mi 07.12.2005 18:47
Titel
|
|
|
| Code: |
body{
text-align: center;
}
#container{
position: relative;
margin-left: auto;
margin-right: auto;
}
|
|
|
| |
 |
|
|
Anzeige
|
|
|
helo
Dabei seit: 07.12.2005
Ort: innerorts
Alter: -
Geschlecht:
|
Verfasst Mi 07.12.2005 19:19
Titel
|
|
|
#div {
position: absolute;
width: 770px;
left: 50px;
margin-left: -385px;
}
|
|
| |
|
|
chrikle
Dabei seit: 02.05.2002
Ort: NRW
Alter: 47
Geschlecht:
|
Verfasst Mi 07.12.2005 19:26
Titel
|
|
|
| helo hat geschrieben: | #div {
position: absolute;
width: 770px;
left: 50px;
margin-left: -385px;
} |
Minus-Werte sind aber häßlich, wenn das Browserfenster
kleiner als die Fläche ist.
Nur mal so 
Gruß
Chris
|
|
| |
|
|
helo
Dabei seit: 07.12.2005
Ort: innerorts
Alter: -
Geschlecht:
|
Verfasst Mi 07.12.2005 21:28
Titel
|
|
|
@chrikle
wie klein soll das fenster denn noch sein?
bei 770 passts doch allemal.
oder was meinst du?
|
|
| |
|
|
chrikle
Dabei seit: 02.05.2002
Ort: NRW
Alter: 47
Geschlecht:
|
Verfasst Do 08.12.2005 07:50
Titel
|
|
|
Moin!
Bastelst du die Seite nur für Dich?
Oder für das breit gefächerte Publikum?
Es gibt tatsächlich noch welche mit 15'-Monitoren
(hab ich vor kurzem noch selbst erlebt).
Und dann auch noch welche, die das Browserfenster
nur halb so groß öffnen, wie es der Bildschirm eigentlich zuläßt.
Und wenn du dann Minus-Werte anwendest, läuft dein
Inhalt links und rechts aus dem Browser-Fenster.
Ich würd dir gtz Methode empfehlen. Da stößt
der Inhalt dann einfach am Fenster, und es erscheinen
Scrollleisten.
Aber das nur mal so als Tipp
Gruß
Chris
|
|
| |
|
|
helo
Dabei seit: 07.12.2005
Ort: innerorts
Alter: -
Geschlecht:
|
Verfasst Do 08.12.2005 13:17
Titel
|
|
|
| Zitat: | Es gibt tatsächlich noch welche mit 15'-Monitoren
(hab ich vor kurzem noch selbst erlebt).
|
klar.
es gibt auch noch welche mit schrankwand eiche rustikal im wohnzimmer.
(hab ich vor kurzem noch selbst erlebt).
soll man jetzt auch noch 4.78 berücksichtigen?
die masse hat sich in den letzten 5 jahren einen rechner&monitor zugelegt.
so schlecht sind deren voraussetzungen nicht mehr. und die masse hat auch nicht 4 fenster gleichzeitig auf
und 8x600 wohl längst nicht mehr
und meint man, man müsse sich eine seite im minifenster, viell. auf 640x480 - toolbars, -status, - etc.
ansehen, dann selbst schuld. dann kann mans auch gleich lassen.
Wir haben übrigens auch fast 2006!
Aber das nur mal so als Tipp
gruß
helo
|
|
| |
|
|
funkydj
Dabei seit: 27.10.2005
Ort: gummersbach
Alter: 44
Geschlecht:
|
Verfasst Do 08.12.2005 14:25
Titel
|
|
|
Du glaubst gar nicht wieviele noch mit nem 14 Zoll Röhrenmonitor im Internet surfen! Das sollte man nicht unterschätzen!
Im Zweifelsfalle kann man ja mit Javascript die Auflösung abfragen und die optimal angepasste Seite aufrufen!
Von der Auflösung muss man zusätzlich auch noch Menü- und Scrollleisten abziehen, also ist der Sichtbare Bereich für Webseiten schonmal viel kleiner als die Auflösung.
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
[CSS] Textnavigation horizontal zentrieren
[CSS] Zentrieren vertikal und horizontal
[CSS] Bildergalerie horizontal zentrieren (responsive)
[CSS] Fixen Container horizontal und vertical zentrieren
[CSS] feste Spalten - Seite soll horizontal scrollen
Seite zentrieren
|
|
Willkommen auf dem Portal für Mediengestalter
