zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Pixelgenaues Design - Boxmodell-Fehler im IE 6 ???

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 13.10.2004, 13:34
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.10.2004
Beiträge: 1
Mirakulum befindet sich auf einem aufstrebenden Ast
Standard Pixelgenaues Design - Boxmodell-Fehler im IE 6 ???

Aufgabe:
In mittig platzierter Box fester Größe (799px breit) sollen nebeneinander die Box #bb (242px) und #tt (409px) stehen, so daß #tt 91 px vom rechten Rand entfernt ist, d.h. der Abstand der beiden 53px beträgt (4px gehen noch für den Rahmen drauf).

Umsetzung:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
<!--
html, body {
	height:100%; 
	padding:0; 
	margin:0; 
	font-family: Verdena, Arial, Helvetica, sans-serif;
}
#horizon {
	text-align: center;
	position: absolute;
	top: 50%;
	left: 0px;
	width: 100%;
	height: 1px;
	overflow: visible;
	visibility: visible;
	display: block;
}
#content {
	margin-left: -400px;
	position:absolute;
	top:-240px;
	left:50%;
	width:799px; 
	height: 480px;
	visibility: visible;
	border: 1px solid #085194;
}
#bb {
	width:242px;
	float:left; 
	border:solid 1px red;
}
#tt{
	width:409px;
	margin-right:91px; 
	margin-top:20px;
	float:right;
	text-align:left;
	border:solid 1px green;
}
#t1 {
	text-align:right; 
}
#t2 {
	padding-top:5px; 
	font-size: 30px; 
}
-->
</style>
</head>
<body>
<div id="horizon">
	<div id="content">
			<div id="bb">
				[img]dummy.jpg[/img]</div>
			<div id="tt">
				<div id="t1">Lalalalalalal</div>
				<div id="t2">Lololololo</div>
			</div>
	</div>
</div>
</body>
</html>
Mozilla, Konqueror, Opera sind okay, aber der IE 5.5 und auch 6.0 (!!!) machen die content-box um den margin-right-Betrag größer und verschieben den textblock tt aber um das Doppelte (!) dieses Betrages nach links - warum ????

Folgender Alternativcode funktioniert dann im IE, aber nicht mehr im Konqueror:
Code:
 
#tt{
	width:409px;
	position:relative; 
	left:-91px; 
	top:20px; 
	float:right;
	text-align:left;
	border:solid 1px green;
}
Wie ist das was passiert zu verstehen und gibt es eine Lösung für beide Browser (ohne Hacks, zur Not mit validen Hacks) ?

Bin gespannt auf Eure Antworten
Michael[/code]
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 28.10.2004, 09:03
Neuer Benutzer
neuer user
 
Registriert seit: 15.07.2004
Beiträge: 12
magicmomo befindet sich auf einem aufstrebenden Ast
Standard

schonmal padding probiert?
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
Redesign für Steiner Cycling Team pkipper Site- und Layoutcheck 11 09.02.2011 12:25
Wo ist der Fehler in diesem Design (im IE6)? Strubbl CSS 8 25.01.2008 11:57
Immer noch ein Fehler im IE6 bei 3 faux col design Krischu CSS 3 24.05.2007 11:07
pixelgenaues Design und Barrierefreiheit dirkounet Barrierefreiheit 21 24.01.2006 14:53
pixelgenaues design mit css! sascha CSS 8 01.11.2004 18:06


Alle Zeitangaben in WEZ +2. Es ist jetzt 08:04 Uhr.