Autor |
Nachricht |
Benutzer 4545
Account gelöscht Threadersteller
Ort: -
|
Verfasst So 29.07.2007 11:39
Titel warum wird div nicht zentriert? |
|
|
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
|
|
|
Haste nen Link zur Preview?
|
|
|
|
|
Anzeige
|
|
|
Benutzer 4545
Account gelöscht Threadersteller
Ort: -
|
Verfasst So 29.07.2007 12:03
Titel
|
|
|
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
|
|
|
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!
|
|
|
|
|
dastef
Dabei seit: 03.11.2003
Ort: -
Alter: -
Geschlecht:
|
Verfasst So 29.07.2007 12:59
Titel
|
|
|
weil die boxen die "drin" liegen jeweils selbst floaten .. du brauchst
am ende irgend nen element das clear't ..
|
|
|
|
|
Need_you
Dabei seit: 02.06.2006
Ort: -
Alter: -
Geschlecht:
|
Verfasst So 29.07.2007 13:02
Titel
|
|
|
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
|
|
|
|
|
nicoG
Dabei seit: 25.01.2006
Ort: Freiburg
Alter: -
Geschlecht:
|
Verfasst So 29.07.2007 13:28
Titel
|
|
|
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! |
Klar, entweder es wird nach links floaten doer zentriert, beides geht eben nicht
Wie dastef bereits angedeutet hat, musst du das Floaten wieder clearen. Das tust du zwar im Footer, kommt aber zu spät
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
|
|
|
|
|
Benutzer 4545
Account gelöscht Threadersteller
Ort: -
|
Verfasst So 29.07.2007 15:22
Titel
|
|
|
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?
|
|