Hier ist meine Homepage, die bis jetzt nur aus einem flashobjekt besteht: "gelöscht"
Für das Objekt hab ich eine Div festegelegt und im header auf das externe stylesheet verwiesen.
im css steht:
"div#flash
{
margin-left:auto; margin-right:auto; width:18em;
background-color:#e4f3fe;
}"
Trotzdem ist die Homepage ("gelöscht") nicht mittig, sonder an der rechten Seite angerichtet. Wie kann das sein? Kann mir bitte jemand weiterhelfen??
lg jonathan
Professionelles Webdesign erlernen mit dem Webdesign Tutorial
Mein Punktekonto 0 Punkte
Flash objekt mittig ausrichten mit .css [gelöst]
Moderatoren: Basti, Ulli H.
6 Beiträge
• Seite 1 von 1
Flash objekt mittig ausrichten mit .css [gelöst]
von klausuhltzscht am 20.09.2010, 19:51
Zuletzt geändert von klausuhltzscht am 21.09.2010, 17:16, insgesamt 2-mal geändert.
.
-
klausuhltzscht - Mitglied
- Beiträge: 351
- Registriert: 10.05.2007, 21:25
- Wohnort: Regensburg
Re: Flash objekt mittig ausrichten mit .css
von wro am 20.09.2010, 23:22
width mit 18em - sicher gibt das 900px?
Besser wäre das doch so:
<body>
<div style="position: absolute; width: 100%; height: 100%; top: 50%; margin-top: -275px;"><!-- margin top: -1/2 Flash höhe - stellt sicher dass das ding auch vertikal mittig ist -->
<div class="flash" style="margin: auto;" >
<object>.....
</div>
</div>
Am Besten noch body resetten, also body {margin: 0; padding: 0;} - so zur Sicherheit, denn für absolute wird es wahrscheinlich keine Rolle spielen (aber IE bringt da immer was tolles zustande und erstaunt mich mmer aufsneue)
Btw. eigentlich in die Kathegorie CSS/HTML
Liebe Grüße
Besser wäre das doch so:
<body>
<div style="position: absolute; width: 100%; height: 100%; top: 50%; margin-top: -275px;"><!-- margin top: -1/2 Flash höhe - stellt sicher dass das ding auch vertikal mittig ist -->
<div class="flash" style="margin: auto;" >
<object>.....
</div>
</div>
Am Besten noch body resetten, also body {margin: 0; padding: 0;} - so zur Sicherheit, denn für absolute wird es wahrscheinlich keine Rolle spielen (aber IE bringt da immer was tolles zustande und erstaunt mich mmer aufsneue)
Btw. eigentlich in die Kathegorie CSS/HTML
Liebe Grüße
- wro
- Mitglied
- Beiträge: 102
- Registriert: 22.08.2010, 19:38
Re: Flash objekt mittig ausrichten mit .css
von klausuhltzscht am 20.09.2010, 23:47
width mit 18em - sicher gibt das 900px?
Erlich gesagt, weis ich nicht, was width bedeutet.
Ich hab jetzt in das .css Dokument folgendes eingefügt:
"div#flash
{margin: 0; padding: 0;
position: absolute; width: 100%; height: 100%; top: 50%; margin-top: -275px;"><!-- margin top: -1/2 Flash höhe - stellt sicher dass das ding auch vertikal mittig ist -->
<div class="flash" style="margin: auto;" }"
Mit diesem Code ist die Homepage jedoch linksbündig. Hab ich wieder was falsch gemacht?
.
-
klausuhltzscht - Mitglied
- Beiträge: 351
- Registriert: 10.05.2007, 21:25
- Wohnort: Regensburg
Re: Flash objekt mittig ausrichten mit .css
von wro am 21.09.2010, 05:10
ja, schon
also width bedeutet breite und setzt die breite des Containers auf 18em. das entspricht 16px bei normalen einstellungen. D.h, mit dieser Angabe hast Du einen ca. 150px breiten Container, der mittig ausgerichtet ist. Da die breite der animation 900px beträgt, brechen die übrigen 650px nach rechts.
Nun, das einfachste wäre in der css:
Die Lösung, die ich vorgeschlagen habe war aufwendiger aber etwas umfangreicher:
HTML:
CSS:
Wenn Du eine von den Lösungen nimmst muss es klappen.
der code, den ich Dir zuerst gegeben habe war nur für HTML
also width bedeutet breite und setzt die breite des Containers auf 18em. das entspricht 16px bei normalen einstellungen. D.h, mit dieser Angabe hast Du einen ca. 150px breiten Container, der mittig ausgerichtet ist. Da die breite der animation 900px beträgt, brechen die übrigen 650px nach rechts.
Nun, das einfachste wäre in der css:
- Code: Alles auswählen
div#flash
{
margin:auto;
background-color:#e4f3fe;
}
Die Lösung, die ich vorgeschlagen habe war aufwendiger aber etwas umfangreicher:
HTML:
- Code: Alles auswählen
<body>
<div id="wrapper">
<div id="flash">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="900" height="550" id="FlashID" title="menü">
<param name="movie" value="index.swf" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="6.0.65.0" />
<!-- Dieses param-Tag fordert Benutzer von Flash Player 6.0 r65 und höher auf, die aktuelle Version von Flash Player herunterzuladen. Wenn Sie nicht wünschen, dass die Benutzer diese Aufforderung sehen, löschen Sie dieses Tag. -->
<param name="expressinstall" value="../Scripts/expressInstall.swf" />
<!-- Das nächste Objekt-Tag ist für Nicht-IE-Browser vorgesehen. Blenden Sie es daher mit IECC in IE aus. -->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="index.swf" width="900" height="550">
<!--<![endif]-->
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="6.0.65.0" />
<param name="expressinstall" value="../Scripts/expressInstall.swf" />
<!-- Im Browser wird für Benutzer von Flash Player 6.0 und älteren Versionen der folgende alternative Inhalt angezeigt. -->
<div>
<h4>Für den Inhalt dieser Seite ist eine neuere Version von Adobe Flash Player erforderlich.</h4>
<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Adobe Flash Player herunterladen" width="112" height="33" /></a></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
</div>
<script type="text/javascript">
<!--
swfobject.registerObject("FlashID");
//-->
</script>
</body>
CSS:
- Code: Alles auswählen
div#flash
{
margin:auto;
}
div#wrapper
{
background-color:#e4f3fe;
margin: 0;
padding: 0;
position: absolute;
width: 100%;
height: 100%;
top: 50%;
margin-top: -275px;
}
body
{
margin: 0;
padding: 0;
}
Wenn Du eine von den Lösungen nimmst muss es klappen.
der code, den ich Dir zuerst gegeben habe war nur für HTML
- wro
- Mitglied
- Beiträge: 102
- Registriert: 22.08.2010, 19:38
Re: Flash objekt mittig ausrichten mit .css
von klausuhltzscht am 21.09.2010, 17:15
Danke wro für die Mühe!;)
Ich hab den ersten Code ausprobiert, aber es hat wieder nicht geklappt.
Hab nochmal neu angefangen und meine Flashdatei in eine zentrierte Tabelle gelegt. Mit diesem Weg ist es gegangen und ich bin zufrieden!
Ich hab den ersten Code ausprobiert, aber es hat wieder nicht geklappt.
Hab nochmal neu angefangen und meine Flashdatei in eine zentrierte Tabelle gelegt. Mit diesem Weg ist es gegangen und ich bin zufrieden!
.
-
klausuhltzscht - Mitglied
- Beiträge: 351
- Registriert: 10.05.2007, 21:25
- Wohnort: Regensburg
Re: Flash objekt mittig ausrichten mit .css [gelöst]
von wro am 21.09.2010, 17:58
tabelle ist echt nicht gut. Vielleicht ging es nicht, weil du erst body
{
position: relative
width: 100%
height: 100%
}
geben musst?
{
position: relative
width: 100%
height: 100%
}
geben musst?
- wro
- Mitglied
- Beiträge: 102
- Registriert: 22.08.2010, 19:38
6 Beiträge
• Seite 1 von 1
Wer ist online?
Mitglieder in diesem Forum: 0 Mitglieder und 1 Gast