• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

HTML Position / Browser Problem

M

MaxG

Neues Mitglied
Hallo Zusammen.
Ich habe eine Homepage in der ein Youtube Element eingebunden ist und eine Feste Position zugewiesen bekommen hat.... Der Code:

HTML: 
<li style="position:relative; top:375px; left:237px; list-style-type:none"> <object width="190" height="25"><param name="movie" value="http://www.youtube.com/v/_4r0qLfiJLQ?fs=1&autoplay=1"></param><param name="allowFullScreen" value="false"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/_4r0qLfiJLQ?fs=1&autoplay=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="false" width="190" height="25"></embed></object> </li>

Die Position habe ich mit Relative angegeben weil sich der Inhalt immer im Center berreich bewegt und wenn ich das Youtube Element mit absolute fest setze bewegt es sich nicht mir der Seite mit....

Der komplette HTML Code sieht so aus:

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loos e.dtd kopieren">
<html>
<head>
<link href="Data/Kontakt.css" rel="stylesheet" type="text/css" />
<title></title>

</head>
<body>
<div id="container">
<ul id="navi">
<li style="position:relative; top:38px; left:152px;" ><a href="index.html"><font color="#ffffff" face="Courier"><small>Infos</small></font></a></li>
<li style="position:relative; top:38px; left:253px;" ><a href="kontakt.html"><font color="#ffffff" face="Courier"><small>Kontakt</small></font></a></li>
<li style="position:relative; top:38px; left:368px;" ><a href="galerie.html"><font color="#ffffff" face="Courier"><small>Galerie</small></font></a></li>
<li style="position:relative; top:38px; left:475px;" ><a href="anfahrt.html"><font color="#ffffff" face="Courier"><small>Anfahrt</small></font></a></li>

</ul>


<form style="position:relative; top:135px; left:147px; width: 348px;" id="emf-form" 
    enctype="multipart/form-data" method="post" action="NachrichtenFehler.html"><table style="text-align:left;" cellpadding="2" cellspacing="0" border="0" bgcolor="transparent"><tr><td style="" colspan="2"><font face="Verdana" size="2" color="#ffffff"></label><br /></font></td></tr><tr valign="top"><td style="" align=""><font face="Verdana" size="2" color="#ffffff"><b>Dein Name:</b></font><span style="color:red;"><small>*</small></span></td></tr><tr><td style=""><input id="element_0" name="element_0" value="" size="30" class="validate[required]" type="text" /><div style="padding-bottom:8px;color:#ffffff;"><small><font face="Verdana"></font></small></div></td></tr><tr valign="top"><td style="" align=""><font face="Verdana" size="2" color="#ffffff"><b>Dein Anlass:</b></font><span style="color:red;"><small>*</small></span></td></tr><tr><td style=""><div style="width:100%;padding-bottom:5px;"><input id="element_1_0" name="element_1" value="Ich habe eine Frage" class="validate[required]"  type="radio" /><font face="Verdana" size="2" color="#ffffff">&nbsp;Ich habe eine Frage&nbsp;</font></div><div style="width:100%;padding-bottom:5px;"><input id="element_1_1" name="element_1" value="Ich möchte mich anmelden" class="validate[required]"  type="radio" /><font face="Verdana" size="2" color="#ffffff">&nbsp;Ich möchte mich anmelden&nbsp;</font></div><div style="width:100%;padding-bottom:5px;"><input id="element_1_2" name="element_1" value="Sonstige" class="validate[required]"  type="radio" /><font face="Verdana" size="2" color="#ffffff">&nbsp;Sonstige&nbsp;</font></div><div style="clear:both;"></div><div style="padding-bottom:8px;color:#ffffff;"><small><font face="Verdana"></font></small></div></td></tr><tr valign="top"><td style="" align=""><font face="Verdana" size="2" color="#ffffff"><b>Deine Nachricht:</b></font><span style="color:red;"><small>*</small></span></td></tr><tr><td style=""><textarea id="element_2" name="element_2" cols="40" rows="8" class="validate[required] "></textarea><div style="padding-bottom:8px;color:#ffffff;"><small><font face="Verdana"></font></small></div></td></tr><tr><td colspan="2" align="right"><input name="element_counts" value="3" type="hidden" /><input  value="Senden" type="submit" /></td></tr></table></form>


<li style="position:static; top:375px; left:237px; list-style-type:none"> <object width="190" height="25"><param name="movie" value="http://www.youtube.com/v/_4r0qLfiJLQ?fs=1&autoplay=1"></param><param name="allowFullScreen" value="false"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/_4r0qLfiJLQ?fs=1&autoplay=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="false" width="190" height="25"></embed></object> </li>

</div>

</body>
</html>

aktuell habe ich das Problem das dass Element nicht in allen Browsern an der richtigen stelle ist:/

Hier ein Screenshot:

1.JPG


Die Seite baut auf einer CSS Seite auf...deren Code hier:

HTML: 
body {
background-color: #01111e;
}

a:link, a:visited { color: #ffffff; text-decoration: none; font-weight: normal; } 
a:active, a:hover { color: #ffffff; text-decoration: underline; }



#container {
margin: 0px auto;
background: url(Images/Kontakt.jpg);
background-repeat:no-repeat;
width: 718px; /* Hier die breite des Bildes angeben */
height: 960px; /* Hier die höhe des Bildes angeben */
}
 
#navi {
padding: 0;
margin: 0;
width: auto;
}

 
#navi li {

padding: 0px;
list-style: none; /* dadurch verschwinden die aufzählungszeichen der listen-links (standard ist die runde Kugel) */
width: 0px; /* Hier die width (breite) der weißen Flächen angeben, auf die die Menüpunkte stehen solln */
float: left; /* Dadurch werden die <li>'s die wiederum die Links beinhalten HORIZONTAL angeordnet*/

}

jetzt die Frage....wie verdammt nochmal bekomme ich es hin das das Objekt in allen Browsern an der richtigen Stelle ist?:D
 
Man sollte position vermeiden, wenn man nicht weiß wozu es wirklich gut ist. Diese Seite sieht nicht danach aus als wäre das der Fall. Ich würde dir raten ohne position zu arbeiten und float zu nutzen um Elemente nebeneinander zu positionieren.
 
schön wenn Ihr das alle besser wisst aber zum Fragen ist das Forum doch da oder irre ich mich da?:D Und das Ziel ist es eine Antwort zu bekommen und wenn ich wüsste was ihr genie's alle so denkt oder wie ihr es besser machen würdet dann würde ich nicht fragen...bekomme ich also auch mal eine produktive antwort...ich kann mit den Begriffen nix anfangen....
 
Ich habe dir bereits eine Antwort gegeben in der relevante Begriffe auftauchen. Gerne verlinke ich sie dir hier auch noch:

float-Verständnis
SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen
float: Elemente umfließen lassen: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets

position-Verständnis
position: Positionsart: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets

Dort findest Du nicht nur informative Texte sondern auch Beispiele die dir helfen sollten deinen Quellcode weiterzuentwickeln.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben