Seite 1 von 1

Div position? Wie macht Ihr dass??

Verfasst: 12.07.2005, 22:53
von Wirths Media
Hallo,

ich positioniere meine Div´s immer mit position:absolute....

Dies hat leider den nachteil, dass es in den Browsern verschieden aussieht.

Nach was zur anmerkung...

Ich habe meinen Content immer an erster stelle.

<div id="contect"></div>
<div id="top"></div>

Wie löst Ihr das Problem?

Gibt es da überhaupt eine Lösung?

Danke

Daniel

Verfasst:
von

Div position? Wie macht Ihr dass??

Verfasst: 13.07.2005, 06:04
von derHund
ohne absolute positionierung (die, nebenbei bemerkt, die schlechteste aller möglichkeiten ist) wirst du den content nicht (situationsbedingt) nach vorn kriegen. ich würde aber trotzdem drauf verzichten.

Div position? Wie macht Ihr dass??

Verfasst: 13.07.2005, 09:40
von Michael
Wenn Du es richti machst, sieht es in allen Browsern gleich aus. (Ausser Opera und die alten Browser bis Version 4)

Schreibe mal ein Beispiel, dann kann ich Dir vermutlich helfen.

position:absolute ist nicht schlechter als die anderen Methoden den Content zu postionieren. Es kommt halt immer darauf an, was man machen möchte. Ich mache selber viel mit position:absolute.

Gruß
Michael

Verfasst:
von
SEO Consulting bei ABAKUS Internet Marketing
Erfahrung seit 2002
  • persönliche Betreuung
  • individuelle Beratung
  • kompetente Umsetzung

Jetzt anfragen: 0511 / 300325-0.


Div position? Wie macht Ihr dass??

Verfasst: 13.07.2005, 09:56
von Wirths Media
Ja, meist bekomme ich es auch (fast) gleich hin in allen browsern....

Momentan bastell ich an einem Kontaktformular...

In dieser EMail (html) soll sich die größe automatisch anpassen, was leider nicht funktioniert..., da pos:absolute angegeben ist.


Noch nen beispiel...

In dem Kontaktformular wollte ich die Felder mittels pos:absolute ausrichten, doch dies sah in allen Browsern anders aus... ( Hab nun ne kleine Tabelle genommen ).

Woher kommt so etwas?

Warum können die Ihre Browser nicht einheitlich Progammieren?

MfG


Hier noch mal der Quellcode vom Kontaktformular ( EMail ):

<?php

$Anrede = $_POST["Anrede"];
$Firma = $_POST["Firma"];
$Name = $_POST["Name"];
$Mail = $_POST["Mail"];
$Strasse = $_POST["Strasse"];
$Ort = $_POST["Ort"];
$Telefon = $_POST["Telefon"];
$Mobiltelefon = $_POST["Mobiltelefon"];
$Fax = $_POST["Fax"];
$Kontakt_per_Mail = $_POST["Kontakt_per_Mail"];
$Kontakt_per_Telefon = $_POST["Kontakt_per_Telefon"];
$Mitteilung = $_POST["Mitteilung"];
$Kontakt_per = "";
$IP = $_POST["IP"];
$UserAgent = $_POST["UserAgent"];
$datum = date("d.m.Y");
$zeit = date("H:i");
$Empfaenger = "info@.de";

$subjekt = "$Name $Firma";

$headers = "Content-type: text/html; charset=iso-8859-1\r\n";
$headers .= "From: $Mail\r\n";

if($Kontakt_per_Mail != "" AND $Kontakt_per_Telefon != "")
{ $Kontakt_per = "Telefon und <a href=\"mailto:".$Mail."?subject=Ihre Anfrage vom ".$datum." ".$zeit." an ...\" style=\"text-decoration:none; color:#c0c0c0;\">EMail</a>"; }
elseif ($Kontakt_per_Mail == "eMail")
{ $Kontakt_per = "<a href=\"mailto:".$Mail."?subject=Ihre Anfrage vom ".$datum." ".$zeit." an ...\" style=\"text-decoration:none; color:#c0c0c0;\">EMail</a>"; }
elseif ($Kontakt_per_Telefon == "Telefon")
{ $Kontakt_per = "Telefon"; }
else
{ $Kontakt_per = "Kein Kontakt angegeben."; }

$message = "

<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\"
\"https://www.w3.org/TR/xhtml1/DTD/xhtml1 ... tional.dtd\">

<html>
<head>
</head>

<body style=\"padding:3px 0 3px 0; margin:0; background:#f0f8ff; color:#000000; font:12px arial; text-align:center;\">
<center>

<div style=\"background:#244992; color:#ffffff; border:1px #244992 outset; padding:0; margin:0; width:770px; height:1000px; position:relative; text-align:left;\">

<span style=\"left:40px; top:120px; position:absolute; font:bold 18px arial;\">KONTAKT:</span>

<span style=\"left:40px; top:160px; position:absolute;\">Firma:</span>
<span style=\"left:40px; top:175px; position:absolute; font:bold 18px arial;\">$Firma</span>

<span style=\"left:40px; top:210px; position:absolute;\">$Anrede</span>
<span style=\"left:40px; top:225px; position:absolute; font:bold 18px arial;\">$Name</span>

<span style=\"left:40px; top:260px; position:absolute;\">Strasse:</span>
<span style=\"left:40px; top:275px; position:absolute; font:bold 18px arial;\">$Strasse</span>

<span style=\"left:40px; top:310px; position:absolute;\">Ort:</span>
<span style=\"left:40px; top:325px; position:absolute; font:bold 18px arial;\">$Ort</span>

<span style=\"left:440px; top:160px; position:absolute;\">E-Mail:</span>
<span style=\"left:440px; top:175px; position:absolute; font:bold 18px arial;\"><a href=\"mailto:$Mail?subject=Ihre Anfrage vom $datum $zeit an ...\" style=\"text-decoration:none; color:#c0c0c0;\">$Mail</a></span>

<span style=\"left:440px; top:210px; position:absolute;\">Telefon:</span>
<span style=\"left:440px; top:225px; position:absolute; font:bold 18px arial;\">$Telefon</span>

<span style=\"left:440px; top:260px; position:absolute;\">Telefax:</span>
<span style=\"left:440px; top:275px; position:absolute; font:bold 18px arial;\">$Fax</span>

<span style=\"left:440px; top:310px; position:absolute;\">Mobiltelefon:</span>
<span style=\"left:440px; top:325px; position:absolute; font:bold 18px arial;\">$Mobiltelefon</span>

<span style=\"left:40px; top:360px; position:absolute;\">Kontakt per:</span>
<span style=\"left:40px; top:375px; position:absolute; font:bold 18px arial;\">$Kontakt_per</span>

<span style=\"left:40px; top:410px; position:absolute;\">Mitteilung:</span>
<span style=\"left:40px; top:425px; position:absolute; font:bold 18px arial; padding-right:90px;\">$Mitteilung</span>

<div style=\"width:769px; margin:0; padding:0; bottom:24px; left:0; position:absolute;\">
<div style=\"color:#fff; font:11px Verdana, Geneva, Arial, Helvetica, sans-serif; border-top:1px #00ced1 solid; border-bottom:1px #00ced1 solid; margin:0 7px 0 6px; padding:6px 1px 6px 0; text-align:center;\">
$IP &nbsp; &nbsp; $UserAgent &nbsp; &nbsp; $datum &nbsp; &nbsp; $zeit
</div>
</div>

<div style=\"border:1px #244992 outset; background:url(/images/logo-htg.gif) repeat-y center; width:769px; height:73px; top:0; left:0; position:absolute;\">
<div style=\"top:40px; left:8px; position:absolute;\">
<h2 style=\"font:bold 19px Georgia, Times, serif; margin:0; color:#fff;\">...</h2>
</div>
<div style=\"top:0; right:0; position:absolute;\">
<a href=\"...\"><img style=\"width:212px; height:70px; border:0;\" src=\"/images/....gif\" alt=\"...\" /></a>
</div>
</div>

</div>
</center>
</body>
</html>

";

mail($Empfaenger, $subjekt, $message, $headers);

?>

Div position? Wie macht Ihr dass??

Verfasst: 13.07.2005, 11:04
von Nullpointer
nur mal kurz mein senf:

die browser werden langsam immer valider, vor ein paar jahren konnte man sich noch ins knie bohren.

der ie berechnet leider padding anders, so dass es da zu unterschieden kommen kann. vielleicht ist das eine fehlerquelle.
"ie interpretiert width, als die breite des objekts (inkl. padding), wobei andere die breite des inhalts als width festsetzen. IE5 immer, IE6 im Quirks-Modus.
Um Quirks-Modus auszuschalten musst du ein <!doctype> angeben, und keine <?xml?>-Deklaration verwenden. Und siehe da -- IE6 macht es plötzlich richtig."


validiere mal dein xhtml

statt center solltest du ein div mit margin:auto nehmen.

Div position? Wie macht Ihr dass??

Verfasst: 13.07.2005, 11:06
von Wirths Media
danke werde ich mal machen...

Div position? Wie macht Ihr dass??

Verfasst: 13.07.2005, 12:36
von makemyday
Ich kann in solchen Fällen nur XHTML empfehlen, da mit diesem Standard Pixelgenaue Positionierungen von den neueren Browser einheitlicher interpretiert werden. Hab keinen Beweis dafür, spreche hier nur aus Erfahrung.

Dann gibt es da noch die CSS-Browserweiche:
Wird von allen interpretiert:

Code: Alles auswählen

.klasse &#123;
  margin-top&#58; 10px;
&#125;
Diese Anweisung versteht nur der IE und überschreibt die .klasse:

Code: Alles auswählen

* html .klasse &#123;
  margin-top&#58; 20px;
&#125;
Schon spart man sich komplizierte Browserweichen mit PHP und Javascript.[/code]

Div position? Wie macht Ihr dass??

Verfasst: 13.07.2005, 12:55
von Nullpointer
und zum dynamischen anpassen an die fenstergröße kann ich nur sagen, dass das auch nicht das gelbe vom ei ist. gat auch alles seine grenzen.

analog dazu kann man sich bei java mit layoutmanagern rumschlagen oder einfach absolut positionieren wie bei .net.

Verfasst: 14.07.2005, 00:13
von luigip
derHund schrieb:
ohne absolute positionierung (die, nebenbei bemerkt, die schlechteste aller möglichkeiten ist) wirst du den content nicht (situationsbedingt) nach vorn kriegen.
Es gibt sehr wohl andere Möglichkeiten. Z.B. eine Kombination aus float u. width für den content ist dein Freund!

Div position? Wie macht Ihr dass??

Verfasst: 14.07.2005, 07:06
von derHund
darum schrieb ich
(situationsbedingt)
. es ist nicht in jedem fall machbar.