nicht angemeldet
Probleme beim div in IE udn Firefox
Hallo Forum,
ich habe:
1. das Problem, dass ich gerne den Div-Construct mittig im Browserfenster haben möchte und
2. Im Firefox sticht der Cont3 weiter nach rechts heraus als er sollte, warum?
Ich hoffe Ihr könnt mir helfen.
Grüße
thomas
mein Quelltext:
<html>
<head>
<style type="text/css">
<!--
BODY {
FONT-SIZE: 10px;
FONT-FAMILY: Verdana, Arial, serif;
font-weight: bold;
BACKGROUND-COLOR: #d7f2d1;
color: #666666;
}
#cont1
{
margin-top: 25px;
width: 800px;
height: 150px;
border: 1px #CCCCCC solid;
BACKGROUND-COLOR: #FFFFFF;
}
#cont2
{
float: left;
width: 150px;
height: 650px;
margin-top: 5px;
border: 1px #CCCCCC solid;
BACKGROUND-COLOR: #FFFFFF;
}
#cont3
{
float: left;
width: 650px;
height: 650px;
margin-top: 5px;
border: 1px #CCCCCC solid;
BACKGROUND-COLOR: #FFFFFF;
}
//-->
</style>
</head>
<body>
<div id="cont1">Banner</div>
<div id="cont2">Navigation</div>
<div id="cont3">Hauptteil</div>
</body>
</html>
-
Hallo,
ich habe:
- das Problem, dass ich gerne den Div-Construct mittig im Browserfenster haben möchte
Ein Blick in die http://de.selfhtml.org/navigation/faq.htm@title=FAQ, hätte dir verraten, dass du
margin:0 autosuchst.- Im Firefox sticht der Cont3 weiter nach rechts heraus als er sollte, warum?
1. Grundregel:
Teste niemals zuerst im IE.
2. Grundregel:
Bringe den IE (und auch die Browser) möglichst nicht in den Quirks-Mode! Da der IE sonst das falsche http://de.selfhtml.org/css/formate/box_modell.htm@title=Box-Modell anwendet!Hier fehl der Doctype
<html>
<head>
<style type="text/css">
<!--
…
#cont1
{
margin-top: 25px;
width: 800px;Da ist zu breit für meinen Bildschirm. Erstelle lieber ein flexibles Layout!
height: 150px;
…
BACKGROUND-COLOR: #FFFFFF;
}
//-->„//“ ist kein gültiger CSS-Kommentar!
</style>
</head>
<body>
<div id="cont1">Banner</div>
<div id="cont2">Navigation</div>Du möchtest die Navigation als Liste auszeichnen.
mfg. Daniel
-
Da ist zu breit für meinen Bildschirm. Erstelle lieber ein flexibles Layout!
mfg. Daniel
hallo daniel,
was meinst du mit flexibles design....
-
Hallo,
Da ist zu breit für meinen Bildschirm. Erstelle lieber ein flexibles Layout!
was meinst du mit flexibles design....
Wenn du keine festen breiten vorgibst, passt sich die Seite automatisch an die Größe des Viewports (der Bereich, in dem eine Seite angezeigt wird) an.
Ein paar Beispiele:
<http://de.selfhtml.org/css/layouts/anzeige/2spaltig_links.htm@title=Mit links floatender Navi>
<http://de.selfhtml.org/css/layouts/anzeige/2spaltig_rechts.htm@title=Mit rechts floatender Navi>
http://de.selfhtml.org/css/layouts/anzeige/3spaltig.htm@title=dreispaltigIn deinem Fall würde ich den Hauptteil nicht floaten und ihm keine feste Breite zuweisen. Und auch den Banner, kann man mit etwas Geschick flexibel machen.
Sofern du nicht zu viele Bilder hast, solltest du auch möglichst nicht zu oft „px“-Einheiten verwenden - lieber relativ mit „em“ (sowhl für Schrift, als auch für Höhe und Breite).
mfg. Daniel
-