mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 28.03.2024 14:22 Benutzername: Passwort: Auto-Login

Thema: warum wird div nicht zentriert? vom 29.07.2007


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> warum wird div nicht zentriert?
Seite: 1, 2  Weiter
Autor Nachricht
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst So 29.07.2007 11:39
Titel

warum wird div nicht zentriert?

Antworten mit Zitat Zum Seitenanfang

Hallo, folgendes Problem:

erst hatte ich bei firefox probleme mit dem bg-image, jetzt wird das div nicht mehr mittig im browser (egal ob ie oder firefox) zentriert. was ist falsch??


Code:

html
{
padding:0px;
margin:0px;
}


/*grundlegende einstellungen*/
body
{
margin:0px;
padding:0px;
}

/*umschliesst das gesamte layout*/
#box
{
background-image: url(background.gif);
backgrond-repeat: repeat-y;
width:800px;
margin-right:auto;
margin-left:auto;
padding:0px;
float: left;
}

#kopf
{
background-color:#003399;
height:125px;
margin:0px;
padding:0px;

}

#leiste
{
background-color:#663300;
height:10px;
margin:0px;
padding:0px;

}

#linkebox
{
background-image:url(navi1.jpg);
background-repeat:no-repeat;
width:130px;
padding-left:0px;
float:left;
height:460px;

}

/*der main bereich*/
#main
{
padding: 0px;
margin:0px;
width:500px;
float:left;
background-color:#ffffff;
overflow: auto;
}


/*die rechte sidebar*/
#sidebar
{
width:170px;
height:460px;
padding:0px;
float:left;
background-color:#CCCCCC;

}

#footer
{
clear: both;
width: 800px;
height: 20px;
background-color: #006699;

}


Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<link href="aufbaukomplett.css" rel="stylesheet" type="text/css" media="screen">
</head>

<body>
<div id="box">
  <div id="kopf"></div>
  <div id="leiste" style="padding-left:650px; font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size:10px; color:#FFFFFF; font-weight:bold; ">Impressum | Kontakt</div>
  <div id="linkebox"></div>
  <div id="main"> Das Modell unseres Ausklappmenu-Platzwunders funktioniert mit
    reinem CSS, also ohne JavaScript und ist deshalb suchmaschinenfreundlich und
    barrierearm zugleich. Den Browser-Veteranen aus der Internet-Explorer-Familie
    machen wir das Menu mit Conditional Comments und IE Behaviors schmackhaft.
    Ein bisschen CSS zaubert die horizontale und vertikale Version des Menus aus
    dem gleichen HTML-Quelltext. Platzwunder Ausklppmenu in Aktion Live Demo im
    neuen Fenster: 2D-Ausklappmenu vertikal und - horizontal </div>
  <div id="sidebar"></div>
</div>
</body>
</html>


ps. hab hier schon gesucht aber nix gefunden , was mir geholfen hat.
lg
 
jensen-OMAHD

Dabei seit: 20.06.2005
Ort: Nürnberg
Alter: -
Geschlecht: -
Verfasst So 29.07.2007 11:59
Titel

Antworten mit Zitat Zum Seitenanfang

Haste nen Link zur Preview?
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst So 29.07.2007 12:03
Titel

Antworten mit Zitat Zum Seitenanfang

nee momentan leider nicht.
es hängt halt alles links dran. obwohl margin left und right auf auto ist und das eigentlich funzen sollte oder?


Zuletzt bearbeitet von am So 29.07.2007 12:49, insgesamt 1-mal bearbeitet
 
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst So 29.07.2007 12:50
Titel

Antworten mit Zitat Zum Seitenanfang

hab noch was rausgefunden: wenn ich das float: left aus der #box rausnehme geht es in beiden browsern, aber in firefox wird das hintergrundbild nicht angezeigt! Hä?
 
dastef

Dabei seit: 03.11.2003
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst So 29.07.2007 12:59
Titel

Antworten mit Zitat Zum Seitenanfang

weil die boxen die "drin" liegen jeweils selbst floaten .. du brauchst
am ende irgend nen element das clear't ..
  View user's profile Private Nachricht senden
Need_you

Dabei seit: 02.06.2006
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst So 29.07.2007 13:02
Titel

Antworten mit Zitat Zum Seitenanfang

weiß zwar nicht obs das ist... aber versuch mal folgendes:

#box {
background-image: url(background.gif);
backgrond-repeat: repeat-y;
margin : 0% auto;
width : 800px;
position : relative;
min-height : 100%;
height : auto !important;
height : 100%;
}



LG Alex


Zuletzt bearbeitet von Need_you am So 29.07.2007 13:03, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
nicoG

Dabei seit: 25.01.2006
Ort: Freiburg
Alter: -
Geschlecht: Männlich
Verfasst So 29.07.2007 13:28
Titel

Antworten mit Zitat Zum Seitenanfang

Flowi81 hat geschrieben:
hab noch was rausgefunden: wenn ich das float: left aus der #box rausnehme geht es in beiden browsern, aber in firefox wird das hintergrundbild nicht angezeigt! Hä?

Klar, entweder es wird nach links floaten doer zentriert, beides geht eben nicht Lächel
Wie dastef bereits angedeutet hat, musst du das Floaten wieder clearen. Das tust du zwar im Footer, kommt aber zu spät Lächel

http://www.andreas-kalt.de/webdesign/tutorials/float-theorie

Im Grunde reicht es schon, wenn du dem Container #box ein overflow:hidden; mitgibst, dann dürfte es klappen * Applaus, Applaus *
  View user's profile Private Nachricht senden
Benutzer 4545
Account gelöscht Threadersteller


Ort: -

Verfasst So 29.07.2007 15:22
Titel

Antworten mit Zitat Zum Seitenanfang

danke für eure hilfe. hatte zwischenzeitlich schon gegoogelt und hab jetzt html und der box height: 100% zugewiesen (so ähnlich wurds hier ja auch eben genannt) und jetzt gehts! *jubel* jetzt muss ich nur noch das menü hinkiregen...wir schauen mal *g*
 
 
Ähnliche Themen [CSS] Will nicht zentriert...
<div> zentriert ausrichten
Objekt zentriert
In IE zentriert, in FF nicht
CSS linksbündige ul zentriert
Illustrator: zentriert Ausrichten?
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.