11.01.2005, 17:39
|
|||
|
|||
@andir - Danke
Rundungsfehler  nach mehreren Prüfungen habe ich Folgendes festgestellt:Wird ein Element nicht explizit mit fester Breite/Höhe angegeben, also mit der Einheit Pixel definiert wird es sowohl beim Firefox, als auch beim IE evtl. zu Rundungsfehlern kommen, sofern ein Startpunkt für die absolute Positionierung errechnet werden muß. D.h. ein errechneter Startpunkt wäre sobald [right] oder [bottom] benutzt werden. Diese Problem tritt auch auf wenn das Element in dem absolute positioniert wird der BODY ist. Einzig der Opera scheint diese Probleme nicht zu kennen. Nun habe ich aber zumindest dem IE den Rundungsfehler mit einem Trick abgewöhnt, nur der Firefox (Gecko) läßt sich davon nicht überzeugen. Genannt habe ich das "GHOST"-Container Code:
#rb-port
{ /* Ghost-Container */
position: relative; /* variabler Port fuer #rb [absolute] Layer;
neuer Port vermeidet IE/FF Rundungsfehler in der Hoehe,
sonst waere #side-Port verwendbar */
height: 0; /* ohne Auswirkung in der Hoehe */
width: 0; /* ohne Auswirkung in der Breite */
margin: 0 0 0 auto; /* [auto] setzt Ghost-Container an den rechten Rand;
somit wird Rundungsfehler des IE in der Breite verhindert */
}
Ich setze einen neuen Bezugspunkt, somit muß für die Höhe von #side nichts errechnet werden da der neue Bezugspunkt ja ganz unten ist. Des weiteren wird dieser nicht sichtbare Bezugspunkt durch [margin-left: auto] direkt rechts an den inneren Container-Rand von #side gesetzt. Dadurch muß der rechte Startpunkt nicht errechnet werden. Das ganze funktioniert im IE und im Opera, im Firefox habe ich nur noch einen Rundungsfehler beim rechten Startpunkt. Hat jemand einen Safari bzw. andere Testmöglichkeiten  Hier nochmal der gesamte vereinfachte Code Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>xxxx</title>
<style type="text/css" media="screen,projection" title="Druckvorschau-semantic-Test">
/*<![CDATA[*/
html,body {
margin: 0;
padding: 3px;
background-color: #DDDDDD;
color: #000000;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 100.01%;
}
p {
margin: 7em 0 0 2em;
}
#site {
position: relative; /* variabler Port fuer #lt [absolute] Layer*/
width: 40%;
margin: 0 auto;
border: 1px solid #000000;
padding: 5px 0 0 0;
background-color: #FFFFFF;
}
#rb-port
{ /* Ghost-Container */
position: relative; /* variabler Port fuer #rb [absolute] Layer;
neuer Port vermeidet IE/FF Rundungsfehler in der Hoehe,
sonst waere #side-Port verwendbar */
height: 0; /* ohne Auswirkung in der Hoehe */
width: 0; /* ohne Auswirkung in der Breite */
margin: 0 0 0 auto; /* [auto] setzt Ghost-Container an den rechten Rand;
somit wird Rundungsfehler des IE in der Breite verhindert */
}
#lt, #rb { /* links-oben / rechts-unten */
position: absolute;
width: 3em;
height: 3em;
background-color: #FF9900;
}
#lt {
top: 0px;
left: 0px;
}
#rb {
right: 0px;
bottom: 0px;
}
/*]]>*/
</style>
</head>
<body>
<div id="site">
<h1>nur so zum Test</h1>
Test text - Test text - Test text - Test text</p>
<div id="lt"></div>
<div id="rb-port">
<div id="rb"></div>
</div>
</div>
</body></html>
__________________
</ulle> 
|
| Sponsored Links |
|
11.01.2005, 17:51
|
|||
|
|||
|
Mit dem IE 5 gehts gar nicht - da sitzt das orangene Kästchen dann ganz links und das Ganze ist nicht zentriert.
Betrifft sowohl IE 5 als auch IE5.5 - kannst Du auch mit dem IE6 nachahmen, wenn Du ihn in den Quirksmode schickst.
__________________
Grüße, Terry ... die immer noch sporadisch mitliest, auch wenn sie sich wenig zu Wort meldet ...
|
| Sponsored Links |
|
11.01.2005, 20:56
|
|||
|
|||
|
Zitat:
 , das mit dem zentrieren ist mir aber bewußt, und egal  Zitat:
Code:
* html #rb-port
{ /* fuer IE Win \*/
float: right;
/* */ /* for Mac IE */
}
__________________
</ulle>
|
|
12.01.2005, 11:09
|
|||
|
|||
|
Der Safari zeigt bei deinem letzten bsp (da wo du den ganzen code gepostet hast) alles richtig an.
|
|
12.01.2005, 12:00
|
|||
|
|||
|
@psycho_dmr, Danke Dir
Super - damit kann man nun zumindest dem IE den Rundungsfehler beim positionieren mit RIGHT, innerhalb eines relativ breiten Containers (% oder em), abgewöhnen.
__________________
</ulle>
|
|
13.01.2005, 19:47
|
|||
|
|||
|
Opera 7.52 Kein Problem
Code:
Opera Version 7.52 Build 3834 Platform Win32 System Windows XP Java Sun Java Runtime Environment version 1.4 Opera 7.6 Preview 3, da habe die wohl verschlimmbessert
__________________
</ulle>
|
 |
| Themen-Optionen | |
| Ansicht | |
|
|
Linear-Darstellung
