Plazierung der Steuerelemente bei Verwendung von <embed>

[pseudogc]

geneigte Leser,

ich baue gerade ein paar Webseiten, bei denen ich eine Vorlesefunktion des Seiteninghaltes mittels <embed …> verwenden will. Layoutspezifisches ist *eigentlich* per CSS defniniert:

<style type="text/css">
html,body{margin:0;padding:0}
body{font: 86% arial,sans-serif;text-align:center}
p{margin:0 10px 10px}
a{color: #691d1e}
div#header h1{height:80px;line-height:80px;margin:0;  padding-left:10px;color: #691d1e}
div#container{text-align:left}
div#content p{line-height:1.4}
div#navigation{background:#9db8b2}
div#footer{background: #9d9482;color: #FFF}
div#footer p{margin:0;padding:5px 10px}
div#container{width:700px;margin:0 auto}
div#wrapper{float:left;width:100%}
div#content{margin-left: 200px}
div#navigation{float:left;width:180px;margin-left:-700px}
div#footer{clear:left;width:100%}
</style>

Im weiteren will ich dann innnerhalb des Navigations"containers" (<div id="navigation">) mittels des <embed>-tags eine Funktion zum Anhoeren der Seite bereitstellen (es wird eine MP3-Datei geladen und abgespielt):

<p><strong>Vorlesen:</strong></p>
<p><embed src="http://wo.auch.immer/die/datei/herkommt/vorleser.mp3" width="130" height="16" autostart="false" loop="FALSE"></p>

das funktioniert auch alles ohne Probleme. Wie man geneigter Weise im gefuegtem Bildschirmfoto sehen kann, werden allerdings die grafischen Abspielelemente direkt am linken Rand der CSS-Box plaziert. Text oder Grafiken werden nett und korrekt mit Abstand zum Boxrand plaziert.

Vielleicht hat hier jemand ja eine Idee, man die Plazierung der Abspielelemente des <embed>-tags identisch zum Text einstellen kann?

cheers,

pseudogc

n.b.: die Plazierungsoptionen von <embed> selbst sind ohne Auswirkung.

 

[xlqr]

hast du schon versucht dem <embed> ein margin zuzuweisen? oder ist es genau das was du mit deiner n.b. gemeint hast?

 

[pseudogc]

hallo,

mit "margin" meinst Du was, bzw. wie genau? (<embed> hat einene entsprechenden Parameter?)

Meine nota bene bezog sich darauf, dass scheins Tags wie "align" innerhalb des CSS-Containers fuer <embd> ignoriert werden.

Vielleicht kennt ja auch jemand der freundlich Mitlesenden eine andere Moeglichkeit zum Einbinden von Audio & Co. (<embed> gehoert ja scheins nicht mehr zu HTML4) die gleichermassen (keine zusaetzliche Software) unter verschiedenen OS funktioniert?

cheers,
pseudogc

 

[Manjo]

Die Lösung liegt darin, object und embed ineinander zu verschachteln. Das Ganze ist hier: http://rufposten.de/weblog/Tech/tutorial_quicktime_einbinden.html recht anschaulich mit Begründung beschrieben.

Und wenn Du Dir hier: http://www.channel-ai.com/blog/plugins/quicktime-embed/ den Quellcode mal ansiehst, findest Du eine andere Möglichkeit mittels JS

--edit--
embed ist wahrscheinlich kein Block-ELement. Margin- und Padding funktioniert nur vollständig bei Blockelemente. embed { display:block } hilft vielleicht. Besser wäre aber, einen Div-Tag darum zu legen und diesem die Formatierungen zuzuweisen.

 

[xlqr]

ich würd mal versuchen in dein stylesheet ein

embed{margin:0 10px 10px}

reinzusetzten ...

aber du hast recht, gutes html ist was anderes

<objekt>

wär definitiv besser und da weiss ich auch, dass du mit css z.b. abstände formatieren kannst ...

http://de.selfhtml.org/html/multimedia/objekte.htm
http://de.selfhtml.org/html/multimedia/objekteigenschaften.htm#css

 

[pseudogc]

Dank, Dank, Dank!

fuer die Hinweise. Das Tutorial auf rufposten.de mittels Einbinden einer .M3U-Datei zu streamen hat IMHO schon etwas von groesserem Kino

Im Falle des obigen geposteten Beispieles habe ich mittlerweile entdeckt, dass es *aaah!* browserabhaengig ist. Camino 1.5.2/Firefox 2.0.0.8 rendern die Seite unter Nutzung von CSS, haben aber ein Problem beim Plazieren des <embed>. Safari 3 (und laut telefonischer Auskunft von Freunden auch IE6/7) plaziert korrekt mit dem gleichen linken Abstand, mit dem auch Text oder Bilder plaziert werden. Tja und Opera… Opera rendert die Seite ohne CSS zu nutzen (ich suche dann mal…).

<embed> fand ich halt gerade gut, weil man eben keinerlei weitere, eventuell von Nutzer noch zu installierende Software benoetigt. Nochmals vielen Dank!

cheers,

pseudogc

EDIT: die Einbettung von <embed> in <object> loest das Problem in Camino/Firefox.

 

[Manjo]

Rufposten meint dazu:

Die Einbindung in den HTML-Code ist etwas kompliziert. Das liegt daran, dass die gängigen Browser immer noch verschiedene Tags für die Einbindung von Multimedia-Objekten benötigen. Opera, Mozilla und Netscape überstützen zwar in ihren neuesten Versionen bereits das W3C-konforme object, aber richtig funktionieren tut das noch nicht. Deswegen sollte man zusätzlich immer auch den alten embed Tag verwenden.