iexplorer stellt anders als Firefox da?

Status
Nicht offen für weitere Antworten.
limk

limk

Mitglied
Hallo

Ich habe da ein Problem - habe mir eine kleine Seite in XHTML mit CSS gebastelt. Im Firefox sieht das ganze schön aus, aber im IExplorer ist die Positionierung anders?!

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//DE" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
   ...
<div id="frame">
	
  <div id="navbar">
    <h3>Menu</h3><br />
  </div>

  <div id="navbar2">
    <h3>Login</h3>
    <p>
    	<form name="form1" method="post" action="index.html">
 			  <input name="textfield" type="text" value="Name" /><br />
  			<input name="textfield" type="text" value="Passwort" /><br />
  			<input type="submit" name="Submit" value="Login" />
			</form>
    </p>
  </div>

	<div id="topblog">
		<h2>&nbsp;</h2>
	</div>
  
	<div id="main">
		<h3>Herzlich willkommen</h3>
		<p>...</p>
	</div>

	</div>	

</body>
</html>

und dazu folgender css

Code: 
#frame { 
  background-color:#ededed; 
  margin: 2em 6em 0em 6em; 
  padding: 0.8em 0.8em 0em 0.8em; 
  border-style:solid; 
  border-width:1px; 
  border-color:#666666; }
#topblog { 
  background-color:#FFFFFF; 
  margin: 0em 0em 0.8em 0em; 
  padding: 1em 2em 2em 1em; 
  border-style:solid; 
  border-width:1px; 
  border-color:#aaaaaa; 
  background-image:url(head_winter.jpg)}
#main { 
  background-color:#FFFFFF; 
  margin: 0em 7.5em 0.8em 0em; 
  padding: 0em 0.8em 0em 0.8em; 
  border-style:solid; 
  border-width:1px; 
  border-color:#aaaaaa; }
#navbar { 
  width: 8em; 
  float: right; 
  clear: right; 
  background-color:#FFFFFF; 
  margin: 6.9em -3em 0em 0em; 
  padding: 0em 0.8em 0.8em 0.8em; 
  border-style:solid; border-width:1px; 
  border-color:#CCCCCC; 
  margin-bottom:0.8em; }

kann das am float liegen
Ach und nebenbei noch eine Frage - der XHTML validator meckert immer, wenn ich div tags mit gleicher id benutz, dass brauch ich wegen dem css style, gibt es da noch andere möglichkeiten
 
limk hat gesagt.:
[...]
Ach und nebenbei noch eine Frage - der XHTML validator meckert immer, wenn ich div tags mit gleicher id benutz, dass brauch ich wegen dem css style, gibt es da noch andere möglichkeiten
Zum Vergrößern anklicken....

Klassen! ;) Weise Deine div's mit jeweils richtiger "id" (also nicht doppelt) aus, und erstelle für die mehrfach verwendeten Formatierungen eine Klasse.

HTML: 
<style>
#1 {...}
#2 {...}
.meineKlasse {...}
</style>
<div id="1" class="meineKlasse"></div>
<div id="2" class="meineKlasse"></div>

Gruss
 
Danke das hat mir schonmal weitergeholfen, mal sehen ob ich es jetzt schafe das die Layouts in beiden Browsern ähnlich aussehen :suspekt:
 
Hm? Muss nochmal nachfragen, die höhe und breite der Boxen werden in beiden Browsern gleich dargestellt, aber die Navbar Box, die in der Box Frame steckt wird im iexplorer ca. 20px weiter rechts angezeigt, als in anderen Browsern?!

Hier nochma der Code
Code: 
HTML:
<div id="frame">
	<div id="navbar">
    	    <h3>Menu</h3><br />
  	</div>
</div>


CSS:
#frame {
          background-color : #eae3d9;
          margin : 2em 6em 0;
          padding : 0.8em 0.8em 0;
          border-style : solid;
          border-width : 1px;
          border-color : #666666;
}
#navbar {
          width : 8em;
          float : right;
          clear : right;
          background-color : #ffffff;
          margin : 0em -3em 0.8em 0;
          padding : 0.8em 0.8em 0.8em;
          border-style : solid;
          border-width : 1px;
          border-color : #cccccc;
}
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück