Banner zentrieren ?!

[Aruia]

Heyho da draußen

Stehe grade vor einem neuen Problem. Ich hab auf meine Page oben ein Banner eingefügt, soweit so gut. mit align="center" isses auch hübsch mittig.

sobald ich aber links neben das Banner noch etwas schreiben möchte verschiebt sich das Banner automatisch nach rechts.

Gibt es eine Möglichkeit, das Banner zu fixieren oder gar eine andere Lösung?

(Sagt jetzt bitte nicht:"mach die Schrift auf das Banner!" hab absolut null schimmer von grafiksachen und ich bin grade mit html und css genug gefordert)

Danke im voraus

Edit:

<div style=background-color:#000000>

<p align="center"><img src="showtime2.jpg" alt="Showtime - Rift"</p>

</div>

so hab ich es bsiher gelöst, wahrscheinlich nicht die eleganteste Variante, aber zu mehr war ich einfach nicht in der Lage mit meinen Wissen aus 3 Tagen HTML

Bearbeitet 28. Dezember 2010 von Aruia

[flashpixx]

Pack' den Inhalt des Banner in ein div und zentriere das wie gewünscht via CSS

[Aruia]

Ne Ausrichtung ist kein Problem, wenn ich es über style=position mache.

Ich möchte gerne, dass es einfach IMMER zentriert bleibt, selbst wenn ich den text links daneben verändere.

Und ne CSS Zentrierung (gibt es mit Sicherheit) behersch ich noch nicht

haste nen Code oder ne Site wo ich das gut nachlesen kann?

[flashpixx]

Das mit dem Div kann man genau so machen, wie Du es möchtest. selfhtml.org sollte eine passende Quelle sein

[Aruia]

Auf der Seite war ich auch schon unterwegs und hab da auch die Grundzüge "gelernt"

Hier nochmal mein Code:

<div style="float:left">

<div style="position:static">

<p>test</p>

</div>

</div>

<div style=background-color:#000000>

<div style="position:relative">

<p align="center"><img src="showtime2.jpg" alt="Showtime - Rift"</p>

</div>

</div>

Das Wort "Test dient hier jetzt nur als Platzhalter, aber umso länger das Wort bzw. der Text ist umso weiter verschiebt sich das Pic (showtime2.jpg) nach rechts. Wie man sieht hab ich schon mit position gearbeitet, allerdings führt nichts davon zum erwünschten Erfolg...

Die einzige Möglichkeit die ich bislang gefunden hab, ist erst den Satz bzw das Wort reinzuschreiben und im Anschluss mit einer negativen Postionsangabe über relative das Pic nach links zu verschieben. Allerdings hab ich dann die Befürchtung, wenn es auf anderen Auflösungen angezeigt wird, das Pic nicht mehr zentriert ist bzw. die Ausrichtung nach links fehlschlägt und es einfach bescheiden aussieht.

Noch jmd ne andere Idee bzw. Lösungsvorschlag ?

[flashpixx]

Verwende bitte Code-Tags !

Das Wort "Test dient hier jetzt nur als Platzhalter, aber umso länger das Wort bzw. der Text ist umso weiter verschiebt sich das Pic (showtime2.jpg) nach rechts. Wie man sieht hab ich schon mit position gearbeitet, allerdings führt nichts davon zum erwünschten Erfolg...

Das ist doch auch korrekt, dass es so funktioniert. Du hast in einem Div, der links angeordnet ist einen weiteren Div plaziert, der mittig sein soll. Zusätzlich liegt dieser auf der gleichen "Strukturebene" wie der Text.

Layoute die Div so, dass sie unabhängig von einander sind, d.h. Du hast einen Div für das Topbanner und dann eben weitere Divs links / rechts davon. Zusätzlich kannst Du unterbinden, dass die Divs sich überlappen.

[Aruia]

Das wollte ich ja auch, hab schon alles mögliche versucht, aber entweder is das Pic dann unterhalb, oder irgendwo komplett anders.

Sprich ich weiß nicht wie ich die beiden div's zu schreiben habe, dass sie unabhängig voneinander sind.

Wobei ich meiner Meinung nach, den erst durch

</div>

</div>

geschlossen hab oder nicht?

Sei doch mal so gut und schreib die beiden div's so um, dass es so ist wie ich es gerne hätte. Evtl. versteh ich es dann. Ich steh leider nachwievor aufm Schlauch

[flashpixx]

Sei doch mal so gut und schreib die beiden div's so um, dass es so ist wie ich es gerne hätte. Evtl. versteh ich es dann. Ich steh leider nachwievor aufm Schlauch

Dadurch lernst Du es nicht.

<div class="left">

linker Content

</div>

<div class="banner">

Banner Content

</div>

Nun legst Du zwei CSS Klassen banner und left an und gibst dort die Layoutbeschreibung mit

[Aruia]

Dank dir trotzdem

Werds mal versuchen wenn ich wieder genug Zeit hab, was heute leider nicht mehr der Fall ist.

[Toothrot]

Ich verstehe noch nicht ganz, wie Dein Layout am Ende aussehen soll.

Nun legst Du zwei CSS Klassen banner und left an und gibst dort die Layoutbeschreibung mit

Wobei "left" kein guter Name für eine Klasse ist. Der Name sollte Inhalt/Funktion beschreiben, nicht Ausrichtung oder sonstige Eigenschaften. Und wenn eine Klasse in der Regel nur einmal pro Seite vorkommt, nimmt man besser eine ID.