zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden float wird ignoriert? nach änderung Dokumenttypdeklaration !

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 03.07.2008, 14:12
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Standard float wird ignoriert? nach änderung Dokumenttypdeklaration !

Hallo,
bin neu hier und hoffe ihr könnt mir weiter helfen.
Erst hatte ich das Problem, dass der IE 6 und auch 7 das Boxmodell wohl falsch interpretiert haben, denn das div #inhalt-links-aussen wurde im IE6 und 7 mit einer anderen Höhe dargestellt wie bei den anderen Browsern.

Vorher Dokumenttypdeklaration:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

Über Änderung der Dokumenttypdeklaration hab ich nun erreicht, dass das Ergebnis bzgl der Höhe in allen Browsern gleich aussieht.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

Aber dafür ist nun mein Bild(#Bild1)nun trotz float:right in allen Browsern linksbündig ausgerichtet innerhalb des divs #inhalt-links-aussen.

Ich find den fehler einfach nicht?
Hoffe auf eure Hilfe!
Wenn es eine andere Lösung, als mit der Dokumentdeklaration für die Unterschiedlichen Höhen gibt im IE 6 und 7, gerne! Hauptsache es funktioniert dann alles.
Viele grüße

Hier der Code:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
	<title></title>
	<link rel="stylesheet" href="styles/style.css" type="text/css" media="screen">
		<script language="JavaScript" type="text/javascript">
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
   var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
   if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
</script>
</head>

<body onLoad="MM_preloadImages('img/akademie_aktiv.jpg','img/seminare_aktiv.jpg','img/inhouse_aktiv.jpg','img/vision_aktiv.jpg','img/anmeldung_aktiv.jpg','img/kontakt_aktiv.jpg'),'img/galerie_aktiv.gif');">
<!-- alles weiss -->
<div id="divAll">
	<!-- impressum -->
	<div id="impressum">
	<!-- link --><a href="#">impressum</a><!-- link ende -->
	</div>
	<!-- ende impressum -->
	<!-- div header -->
	<div id="header"><img src="img/logo_gross.jpg" width=461 height=172 border=0 alt="logo"><img src="img/slogan.jpg" width=288 height=172 border=0 alt="slogan"></div>
	<!-- ende header -->
	<!-- div navi -->
	<div id="navi"><a href="index.html" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('home','','img/home_aktiv.jpg',1);"><img name="home" src="img/home_aktiv.jpg" width=107 height=40 border=0 alt=""></a><a href="akademie.html" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('akademie','','img/akademie_aktiv.jpg',1);"><img name="akademie" src="img/akademie.jpg" width=107 height=40 border=0 alt=""></a><a href="seminare.html" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('seminare','','img/seminare_aktiv.jpg',1);"><img name="seminare" src="img/seminare.jpg" width=107 height=40 border=0 alt=""></a><a href="inhouse.html" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('inhouse','','img/inhouse_aktiv.jpg',1);"><img name="inhouse" src="img/inhouse.jpg" width=107 height=40 border=0 alt=""></a><a href="anmeldung.html" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('anmeldung','','img/anmeldung_aktiv.jpg',1);"><img name="anmeldung" src="img/anmeldung.jpg" width=107 height=40 border=0 alt=""></a><a href="kontakt.html" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('kontakt','','img/kontakt_aktiv.jpg',1);"><img name="kontakt" src="img/kontakt.jpg" width=107 height=40 border=0 alt=""></a><img src="img/reserve.jpg" width=107 height=40 border=0 alt=""></div>
	<!-- ende navi -->
	<!-- div inhalt links -->
	<div id="inhalt-links-aussen">
		<h1>Herzlich Willkommen!</h1>
		<p>zzz.</p>
		<p>zzzp>
		<p>Investieren Sie dort, wo es Ihnen den meisten Nutzen bringt</p>
		<p></p>
		<div id="bild1"><img src="img/team_1.jpg" width=184 height=114 border=0 alt="teamwork"></div>
		<p><img src="img/u_schrift.gif" width=200 height=60 border=0 alt="Unterschrift"></p>
	</div>
	<!-- inhalt rechts -->
	<div id="box1_re">
		<div id="box2_re">
			<div id="box3_re"><img src="img/bildlogo.jpg" width=102 height=63 border=0 alt"Logo"><p>zz .</p>
			</div>
		</div>
	</div>
	<!--ende  inhalt rechts -->
	<!-- footer -->
	<div id="footer"></div>
	<!-- ende footer -->
	
	
	
	
	
	
	
	
	
	<!-- ende alles weiss --></div>
</body>
</html>
und hier der css code
Code:
body{
background-color: #DAD7CE;
margin: 0;
text-align: center;
}
div{
background-color: #fff;
font-family: Verdana, Arial, sans-serif;
font-size: 10px;
color: #808080;
text-align: left;
padding: 0;
}
#divAll{
width: 799px;
height: auto!important;
min-height: 100%;
margin: 40px auto 0 auto;
vertical-align: top;
overflow: hidden;
}
#impressum{
position: relative;
margin-top: 10px;
left: 25px;
width: 749px;
height: 15px;
padding: 0;
text-align: right;
}
#impressum a:link, #impressum a:active, #impressum a:visited{
font-family: Verdana, Arial, sans-serif;
font-size: 10px;
color: #808080;
text-decoration: none;
}
#impressum a:hover{
color: #2C1D29;
}
#header{
position: relative;
margin-top: 0px;
left:25px;
width: 749px;
height: 172px;
background-color:#f6f6ef;
}
#navi{
position: relative;
margin-top: 0px;
left: 25px;
width: 749px;
height: 40px;
}
#inhalt-links-aussen{
position: relative;
width: 425px;
min-height: 331px;
height: auto;
_height: 331px;
margin-bottom: 55px;
top: 15px;
left: 25px;
float: left;
padding: 0 0 0 2px;
border: 1px solid #dadada;
}
#box1_re{
position: relative;
width: 287px;
min-height: 331px;
height: auto;
_height: 331px;
float: right;
right: 25px;
top: 15px;
padding: 6px 0 0 0;
background-image: url(../img/box_t.gif);
background-repeat: no-repeat;
background-position: top;
}
#box2_re{
padding: 0 0 6px 0;
margin-bottom: 55px;
background-image: url(../img/box_b.gif);
background-repeat: no-repeat;
background-position: bottom;
}
#box3_re{
min-height: 319px;
height: auto;
_height: 319px;
padding-left: 15px;
padding-right: 15px;
padding-top: 9px;
padding-bottom: 9px;
border-right: 1px solid #dadada;
border-left: 1px solid #dadada;
}
#box3_re img{
float: right;
margin-left: 10px;
}
#footer{
position: relative;
bottom: 25px;
left: 25px;
width: 749px;
height: 40px;
clear: both;
background-image: url(../img/footer_bg.jpg);
background-repeat: no-repeat;
}
.bild-text{
position: relative;
margin-top: 15px;
left: 0px;
float: left;
width: 420px;
height: auto;
padding: 0;
}
.bild-text img{
float: left;
margin-right: 10px;
}
.text-rechts{
position: relativ;
margin-top: 15px;
margin-left: 15px;
width: 260px;
height: auto;
float: left;
}
.text-rechts img{
float: left;
margin-right: 10px;
}
#bild1{
position: relative;
width:100%;
float: right;
margin-top:20px;
}
.bild-text{
position: relative;
float: left;
padding: 0;
}
.bild-text img{
float: left;
margin-right: 15px;
}
.text-rechts img{
float: left;
margin-right: 15px;
}
h1{
font-family: Verdana, Arial, sans-serif;
font-size: 18px;
color: #646464;
margin: 10px 0 10px 0;
}
p{
margin-top: 0;
margin-bottom: 10px;
}

Geändert von caja13 (03.09.2008 um 12:12 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 03.07.2008, 14:26
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 09.07.2004
Beiträge: 1.121
cgdesign befindet sich auf einem aufstrebenden Ast
Standard

Mal einen richtigen Doctype benutzen?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 03.07.2008, 14:40
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Standard auch dieser Doctyp ändert daran nichts

Leider geht es mit dem auch nicht, hab schon verschiedene bereits vorher getestet.

Bild1 bleibt links?????
Mit Zitat antworten
  #4 (permalink)  
Alt 03.07.2008, 14:52
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 09.07.2004
Beiträge: 1.121
cgdesign befindet sich auf einem aufstrebenden Ast
Standard

Kannst das auch mit text-align: right; rechts ausrichten, da du vorher alle divs mit text-align: left; fest ausgerichtet hast.
Mit Zitat antworten
  #5 (permalink)  
Alt 03.07.2008, 14:58
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Standard

wenn ich das mache, ist mein Bild zwar rechts, was ja schon mal schön ist, aber das float wird weiter ignoriert und ich kann keinen Text links neben dem Bild plazieren.
Mit Zitat antworten
  #6 (permalink)  
Alt 03.07.2008, 15:04
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 09.07.2004
Beiträge: 1.121
cgdesign befindet sich auf einem aufstrebenden Ast
Standard

Welchen Text denn? In deinem Beispiel gibt es ja kein Text um das Bild. Außerdem müsstest du dann das #bild1 img floaten und nicht das div ansich.
Mit Zitat antworten
  #7 (permalink)  
Alt 03.07.2008, 15:44
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Standard

sorry meinte nicht den Text sondern das andere Bild(da es eine Unterschrift ist hab ich text gesagt).
Aber mit deinem Tipp #bild 1 img floaten, das wars! Jetzt funktioniert es so wie ich es möchte!
Vielen lieben Dank!!!!!
Mit Zitat antworten
  #8 (permalink)  
Alt 03.07.2008, 17:12
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Standard

Zu früh gefreut, im Internet Explorer geht es natürlich nicht. Das Bild ist zwar rechts, aber das andere Bild ist nun darunter
aber das andere Bild soll daneben und links ausgerichtet sein.
Also meine Frage wie richtet man die Bilder nebeneinander aus das eine links, das andere rechts?
Mit Zitat antworten
  #9 (permalink)  
Alt 03.07.2008, 17:45
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 09.07.2004
Beiträge: 1.121
cgdesign befindet sich auf einem aufstrebenden Ast
Standard

#bild1{
margin-top:20px;
text-align: right
}
#bild1 img{
float: right;
}

Somit sollte es aber schon gehen.
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 07.07.2008, 10:26
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.07.2008
Beiträge: 29
caja13 befindet sich auf einem aufstrebenden Ast
Standard

war leider krank, daher erst heute meine Rückmeldung. Genauso wie du es geschrieben hast hab ich es auch gemacht, funktioniert ja auch in allen Browsern außer im IE.
Hast du da noch eine Idee?
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Float-Problem? mischaef CSS 33 20.10.2010 16:20
text-align wird bei float von FF ignoriert? burnersk CSS 9 08.06.2008 09:25
Mozilla zeigt DIV zu oft an cracki CSS 6 09.03.2008 15:22
IE zeigt gewisse Texte nicht an zitronenbaum CSS 2 16.01.2008 15:25
Testcase: float, overflow: hidden; und alte Geckos... heiko_rs CSS 0 19.11.2007 21:26


Alle Zeitangaben in WEZ +2. Es ist jetzt 10:40 Uhr.