nicht angemeldet
Mein Div macht faxen...
0 1 0 1 0 1 0 0 
Struppi
0
Mein Div macht faxen...
Hey Jungs und Mädels (ich weiss, man beginnt keinen Satz mit "hey"...)
Hab folgendes, mittlerweile sprichwörtlich grosses Problem:
Auf der Seite www.sportsbar-chur.ch ist grundsätzlich alles in Ordnung. Die Struktur ist relativ einfach: div, im div im oberen Bereich ein Flash, im unteren ein iFrame...
Nun, in (fast) allen Browsern wird alles so dargestellt, wie ich es eigentlich gärne hätte... Nur, das Problem ist folgendes:
Unser Flash und das iFrame sind 850px breit. Sobald ich eine Auflösung über 1800dpi habe, wird das Flash auf der linken, das iFrame auf der rechten Seite angezeigt, Plattform und Browser unabhängig...
Wir haben versucht, via CSS einen absoluten Wert für die Position des Haupt-divs festzulegen. War wohl nix, soll sich ja Browser/Auflösungs/Plattform neutral verhalten.
Durch das setzen von <br> und auch <p>"was weiss ich was alles</p> war das Resultat mehr oder weniger sehr unbefriedigend...
Nun, nach mittlerweile fast 10 Stunden recherche und Konsultationen von hochdekorierten html und css Professoren sind wir am Ende...
Wenn jemand von euch eine Lösung parat hat, DANKE!!!
Greez
Olla, Grüani, Cris
hier noch das komplette script aus Dw CS3:
'''<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Willkommen in der Sportsbar Chur</title>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<style type="text/css">
<!--
body {
margin-top: 60px;
background-color: #BFFFEB;
}
.Stil1 {
color: #FFFFFF;
font-size: 1px;
}
-->
</style></head>
<body >
<div align="center" style="display:block">
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','850','height','100','align','absmiddle','title','Flash','src','sportsbar navi','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','sportsbar navi' ); //end AC code
</script>
<noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="850" height="100" align="absmiddle" title="Flash"> <param name="movie" value="sportsbar navi.swf" />
<param name="quality" value="high" />
<embed src="sportsbar navi.swf" width="850" height="100" align="absmiddle" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash"></embed>
</object>
</noscript>
<iframe src="home.html" name="show" width="850" height="400" align="center" frameborder="0" scrolling="no" marginwidth="0" marginheight="0"></iframe>
</div>
</body>
</html>'''
-
hallo,
hier noch das komplette script aus Dw CS3:
Ich weiß zwar nicht, was "Dw CS3" ist, und ein Script ist das auch nicht. Aber macht vermutlich nix.
.Stil1 {
color: #FFFFFF;
font-size: 1px;
}Warum du das angibst, wenn du es später nicht verwendest, ist rätselhaft. Eine Schriftgröße von 1px bei einer Monitorbreite von 1800 oder mehr Pixeln ergibt aber vermutlich unsichtbar kleine Schriften.
<div align="center" style="display:block">
Das "align" und auch die Style-Angabe könntest du besser in deiner CSS unterbringen. Und auf deiner Seite hast du sogar zwei solche DIVs ineinander geschachtelt, was wohl als hilfloser Versuch zu werten ist, dein Problem irgendwie in den Griff zu kriegen.
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','850','height','100','align','absmiddle','title','Flash','src','sportsbar navi','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','sportsbar navi' ); //end AC code
</script>Was soll da passieren? Wozu ist das gut?
<noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="850" height="100" align="absmiddle" title="Flash"> <param name="movie" value="sportsbar navi.swf" />
<param name="quality" value="high" />
<embed src="sportsbar navi.swf" width="850" height="100" align="absmiddle" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash"></embed>
</object>
</noscript>Warum steht das in "noscript"? Und warum gibst du dein Flash zweimal an? Vermutlich ist dein <embed> überflüssig.
<iframe src="home.html" name="show" width="850" height="400" align="center" frameborder="0" scrolling="no" marginwidth="0" marginheight="0"></iframe>
</div>Dein iframe enthält irgendeine Datei "home.html".
Irgendwie wird dein gesamter Ansatz nicht verständlich. Und übrigens: mit irgendeiner "Auflösung" hat es auch nix zu tun. Das Flash-Teil ist 850px breit, dein iframe auch, also stehen sie brav nebeneinander, sobald eben genügend Platz dafür ist, schließlich _willst_ du das ja so haben nach deinem HTML. Dummerweise können sie das in der Regel nicht - das heißt, jeder, der keinen so riesigen Monitor hat, sieht sie untereinander angeordnet und damit falsch.
Die Struktur ist relativ einfach: div, im div im oberen Bereich ein Flash, im unteren ein iFrame...
Genau das ist sie überhaupt nicht. Ein DIV wirst du vermutlich gar nicht brauchen. Und untereinander stehen deine beiden Elemente (Flasch und iframe) nur dann, wenn die verfügbare Breite nicht ausreicht, um sie nebeneinander zu stellen - allerdings: wer hat schon einen Monitor mit 1800px Anzeigebreite?
Wenn die beiden unbedingt und immer untereinander stehen sollen, wirst du nicht darum herumkommen, mit float zu experimentieren. Aber eventuell genügt es ja, herauszufinden, daß du für deine Navigation doch eigentlich gar kein Flash brauchst, vermutlich nicht einmal einen iframe. Und es ist immer eine gute Idee, auch mal den Validator deiner Wahl zu fragen, was er von deiner Seite hält.
Grüße aus Berlin
Christoph S.
-
Hi,
Das "align" und auch die Style-Angabe könntest du besser in deiner CSS unterbringen.
Wozu? Wirksam ist hier nur das align. Als css würden beide Angaben gar nichts bewirken.
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','850','height','100','align','absmiddle','title','Flash','src','sportsbar navi','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','sportsbar navi' ); //end AC code
</script>Was soll da passieren? Wozu ist das gut?
Hier erfolgt die Flashausgabe bei eingeschaltetem JS
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="850" height="100" align="absmiddle" title="Flash"> <param name="movie" value="sportsbar navi.swf" />
<param name="quality" value="high" />
<embed src="sportsbar navi.swf" width="850" height="100" align="absmiddle" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash"></embed>
</object>
</noscript>Siehe oben. Ansonsten ist das die etwas altmodische Art und Weise, Flash einzubinden.
Dein iframe enthält irgendeine Datei "home.html".
Wenn er keine Datei "enthalten" würde, würde auch nichts angezeigt werden.
Irgendwie wird dein gesamter Ansatz nicht verständlich. Und übrigens: mit irgendeiner "Auflösung" hat es auch nix zu tun. Das Flash-Teil ist 850px breit, dein iframe auch, also stehen sie brav nebeneinander, sobald eben genügend Platz dafür ist, schließlich _willst_ du das ja so haben nach deinem HTML. Dummerweise können sie das in der Regel nicht - das heißt, jeder, der keinen so riesigen Monitor hat, sieht sie untereinander angeordnet und damit falsch.
Ich würde behaupten, er will genau das Gegenteil haben, nämlich untereinander (auch bei 1800er Auflösung).
Genau das ist sie überhaupt nicht. Ein DIV wirst du vermutlich gar nicht brauchen.
Doch. Zwei sogar.
Wenn die beiden unbedingt und immer untereinander stehen sollen, wirst du nicht darum herumkommen, mit float zu experimentieren.
Das genaue Gegenteil ist ist der Fall.
Nimm's mir nicht übel, Christoph, aber deine "Korrekturen" sind eher noch falscher (sic!) als der Originalcode.
Gruß
Antipitch-
hallo,
Ein DIV wirst du vermutlich gar nicht brauchen.
Doch. Zwei sogar.Nein, gar keins. Man kann jedes Element für sich positionieren. Das gilt insbesondere für iframes. Und hier kommt es ja lediglich darauf an, daß die gewünschten Teile irgendwie in der Mitte des Anzeigebereichs landen. Das läßt sich mit CSS relativ einfach machen.
Nimm's mir nicht übel, Christoph, aber deine "Korrekturen" sind eher noch falscher (sic!) als der Originalcode.
Was ich naturgegebenermaßen überhaupt nicht einsehen kann.
Grüße aus Berlin
Christoph S.
-
Hi Christoph,
Was ich naturgegebenermaßen überhaupt nicht einsehen kann.
Solange das Sachliche nicht auf der Strecke bleibt, ist das ja auch eine gute Einstellung. Kurz nochmal:
-
die Angaben in seinem ersten div wären auch als css unwirksam, weil es da align im alten Sinn für Blockelemente nicht gibt und es in diesem Fall ohne Ergänzungen nicht hinzubekommen wäre. Z.B. html, body width: 100%. display:block ist Unsinn, weil div's per default block-level Elemente sind
-
JS, object und embed für Flash war dir ja anscheinend so nicht geläufig, muss man den Frager aber ja nicht zusätzlich verunsichern
-
Deinen Kommentar zum iframe hab ich gar nicht verstanden. Soll er einfach so den iframe da hinstellen, ohne Quelldatei? Und home ist doch als Name ok, denn in der index befinden wir uns ja schon.
-
Gewünscht war finde ich eindeutig, die Dinge untereinander zu haben. Und die Frage "Wie geht das für 1800er Auflösung?" Aber vielleicht war dein Kommentar hier ja auch Ironie...
-
Dein Kommentar zu floats ist wirklich inhaltlich falsch. Denn block-level Elemente BLOCKIEREN für den Bereich ihrer Höhe die gesamte Breite des Elternelementes, auch wenn ihre eigene Breite nur einen Pixel beträgt. Deshalb heißen sie so. Und deshalb liegen sie immer untereinander. Um sie NEBENEINANDER zu legen braucht man bspw. floats oder display inline.
-
Aus dem vorigen Punkt resultiert dann genau das Probem und meine Forderung nach zwei divs. Weder object noch iframes sind nämlich wirkliche block-level Elemente. D.h sobald die Breite von viewport > body es zulassen, schiebt sich der iframe neben das Flash Objekt.
Hoffe ich konnte meinen Ansatz etwas klarer machen. War aber sowieso nicht persönlich gemeint ;-)
Gruß
Antipitch-
hallo,
- JS, object und embed für Flash war dir ja anscheinend so nicht geläufig
Öhm ... das ist eine eklatante Fehlinterpretation.
- Deinen Kommentar zum iframe hab ich gar nicht verstanden. Soll er einfach so den iframe da hinstellen, ohne Quelldatei?
Unsinn. Aber was steht denn in der Datei drin, die in den iframe geladen wird? Ein bißchen Text ... Das kann man doch nun wirklich auch ohne Rahmen in die Seite schreiben.
- Gewünscht war finde ich eindeutig, die Dinge untereinander zu haben.
Gewünscht vielleicht, aber nicht realisiert. Die Realisierung widersprach/widerspricht dem Wunsch, und irgendwie muß man ja deutlich machen, wo so eine Diskrepanz liegen kann.
Aber vielleicht war dein Kommentar hier ja auch Ironie...
Wow. Na gut, wenn du meinst ;-)
- Dein Kommentar zu floats ist wirklich inhaltlich falsch.
Nein, war er nicht, ist er nicht.
Denn block-level Elemente BLOCKIEREN für den Bereich ihrer Höhe die gesamte Breite des Elternelementes
Das ist nur teilweise richtig. Aber der Effekt ist gut beobachtet, und betrifft genau das "Problem": es sollen zwei jeweils 850px breite Elemente untereinander stehen, tun es auch - aber _warum_ sie es tun, und plötzlich bei einer möglichen Anzeigenbreite von mehr als 1700px _nicht mehr_ tun, war dem OP nicht verständlich. Ich habs erklärt.
sobald die Breite von viewport > body es zulassen, schiebt sich der iframe neben das Flash Objekt.
Das ist doch genau das, was ich erklärt habe.
Grüße aus Berlin
Christoph S.
-
Moin Christoph,
dann habe ich deine Anmerkungen vielleicht nur falsch interpretiert. Mißverständnisse kommen vor.
Wobei ich deinen Standpunkt, es benötige floats, um Elemente untereinander darzustellen, immer noch nicht nachvollziehen kann.
Falls du Zeit hast, dir z.B. das hier mal kurz anzusehen:
<body>
<div style="width: 800px">
<div style="width: 400px; background-color:red; float: left">links</div>
<div style="width: 400px; background-color:green; float: left"">rechts</div>
<p style="clear: both"> </p>
</div>
<div style="width: 800px">
<div style="width: 400px; background-color:red; float: left">links</div>
<div style="width: 400px; background-color:green; margin-left: 400px"">rechts</div>
<p style="clear: both"> </p>
</div>
<div style="width: 800px">
<div style="width: 400px; background-color:red;">oben</div>
<div style="width: 400px; background-color:green;">unten</div>
</div>
</body>Gruß
Antipitch-
hallo,
Falls du Zeit hast, dir z.B. das hier mal kurz anzusehen:
<div style="width: 800px">
<div style="width: 400px; background-color:red; float: left">links</div>
<div style="width: 400px; background-color:green; float: left"">rechts</div>
<p style="clear: both"> </p>
</div>Die "einfache" Addition 400+400=800 funktioniert nicht in allen Browsern. Wenn du die beiden eingeschachtelten DIVs 399px breit ziehst und die Zahl der Anführungszeichen korrigierst, könnte es einigermaßen funktionieren - ist aber "zu dick aufgetragen". Vor allem brauchst du dieses
<p style="clear: both"> </p>
wahrscheinlich nicht.
Ein kleiner Auszug aus einer CSS, die ich grade für einen Auftraggeber entwickle (mußte leider ein "Pixellayout" werden fürs Intranet):
#rahmen {width: 985px; border-width: 0 1px 1px 0; border-style: solid; border-color: silver;} #kopf {position: relative; left: 0px; top: 0px; width: 985px;} #left {position: relative; width: 173px; float: left;} #middle {width: 590px; margin-right: 24px; float: left;} #right {width: 194px;} #fuss {position: relative; max-width: 700px; clear: both;}Dem entspricht im HTML dann so eine Struktur:
<div id="rahmen"> <div id="kopf">[...Inhalt...]</div> <div id="left">[...Inhalt...]</div> <div id="middle">[...Inhalt...]</div> <div id="right">[...Inhalt...]</div> <div id="fuss">[...Inhalt...]</div> </div>Wie du vermutest, funktioniert das vorgestellte Beispiel ganz gut, und ich brauche nicht für jedes DIV auch "float" einzusetzen. Vor allem dann nicht, wenn sie tatsächlich untereinander stehen sollen. Sie Breitenangabe für das umschließende DIV verhindert, daß sie bei einem sehr großen Viewport nebeneinander rutschen.
"float" sollte man meiner Ansicht nach nur dann verwenden, wenn es gar nicht anders geht. Häufig reicht auch eine relative Positionierung aus.
Grüße aus Berlin
Christoph S.
-
"float" sollte man meiner Ansicht nach nur dann verwenden, wenn es gar nicht anders geht. Häufig reicht auch eine relative Positionierung aus.
Wobei ich den Sinn davon in dem Beispiel nicht verstehe, es geht auch ganz ohne.
Struppi.
-
Moin,
Wobei ich den Sinn davon in dem Beispiel nicht verstehe
ich auch nicht. D.h. den Sinn der floats versteh ich schon: left, middle und right nebeneinander zu legen (was in diesem Beispiel für den FF aber so nicht funktioniert).
Den Sinn der relativen Positionierung versteh ich allerdings nicht. Auch in den selfhtml Vorlagen für dreispaltige css-layouts (und ein solches soll Christophs letztes Beispiel doch sein) findet sich kein position relative. Denn position-relative macht doch nichts anderes, als mir die Möglichkeit zu eröffnen, ein Element relativ zu seiner sich aus normal flow oder float ergebenden Originalposition zu verschieben. Und zwar ohne dass diese Verschiebung sich auf folgende Elemente auswirkt. Wenn ich aber für top, right, bottom und left keine Werte setze, kann ich mir die Positionierung auch sparen. Oder nich?
Gruß
Antipitch
-
-
-
-
-
-
-
-
Hi Olla,
so z.B.:
<head>
<style type="text/css">
html, body {
width: 100%;
}
body {
margin-top: 60px;
}
div {
margin: 0 auto 0 auto;
width: 850px;
}
</style>
</head>
<body>
<div>Hier Flash</div>
<div>Hier iframe</div>
</body>Wenn du Flash per Javascript ausgibst, solltest du das JS in eine externe DAtei auslagern. Außerdem ist Ausgabe mit object UND embed ein bißchen veraltet.
Gruß
Antipitch