2 Bilder mit text darüber nebeneinander

[Signatura]

Hallo zusammen,

da ich leider absolut keine ahnung von HTML oder CSS habe folgende Frage,

2 Bilder nebeinander positionieren als hintergrund für eine box, darüber soll ein text erscheinen, das hab ich auch ganz gut hinbekommen, wie jedoch veranlasse ich dass die bilder nebeinander ausgegeben werden?
Table? und wenn ja wie? ich wüsste nicht wie ich folgenden code abändern muss.

Entschuldigung falls ich das im falschen Forum gepostet habe....

<div style="width:250px; height:250px; background:url(/images/Modules/box250.png) no-repeat;">Hier deinen Text schreiben</div>
<div style="width:250px; height:250px; background:url(/images/Modules/box250.png) no-repeat;">Hier deinen Text schreiben</div>

 

[Space Vampire]

wrappen und floaten

<div style="width=500px;">
<div style="float:left; width:250px; height:250px; background:url(/images/Modules/box250.png) no-repeat;"><p>Hier deinen Text schreiben</p></div>
<div style="margin-left: 250px; width:250px; height:250px; background:url(/images/Modules/box250.png) no-repeat;"><p>Hier deinen Text schreiben</p></div>
</div>

 

[Signatura]

Vielen Dank

Vielen lieben Dank für die schnelle Antwort.

:-D

 

[Signatura]

Und wie genau krieg ich es hin dass ein bestimmter abstand zwischen den Bildern ist??? oder einfach Bilder breiter machen mit transparenz?


EDIT:

Ich nehm die Frage zurück, kann ich ja mit dem margin left arrangieren, nochmals vielen dank...

 

[Space Vampire]

da du ja interessiert zu sein scheinst, empfehle ich dir noch eine seite, wo du solche doch recht einfachen fragen leicht durch nachschlesen beantworten kannst ;)
CSS 4 You - The Finest in Stylesheets

 

[Signatura]

Okey Danke, werd mich mal durchlesen.

Habe zwar schon diverse Tutorials durch aber CSS bisher noch nicht, werd ich aber jetzt mal nachholen. :mrgreen:

 

[Signatura]

Kennst du oder jemand anders ähnliche Nachschlagewerke wie CSS 4 You - The Finest in Stylesheets für HTML ; PHP UND MYSQL?

Wichtig: Keine Tutorials, sondern tatsächliche Nachschlagewerke!

 

[Elroy]

Hallo.

Semantisch richtig wäre es natürlich den Text zu schreiben und ihm ein Hintergrundbild zuzuweisen, anstatt dafür divs zu missbrauchen.

Gruss
Elroy

 

[Space Vampire]

Ich war auch hin- und hergerissen die vorgegebenen DIVs zu Ps zu machen, bin dann aber wohlwollend davon ausgegangen, dass er in diesen DIVs noch andere Sachen, außer dem Text, gruppiert, und habe deshalb nur die Ps hinzugefügt, statt auszutauschen ;)

 

[Space Vampire]

Kennst du oder jemand anders ähnliche Nachschlagewerke wie CSS 4 You - The Finest in Stylesheets für HTML ; PHP UND MYSQL?

SELFHTML
PHP fr dich - PHP und mySQL einfach und kurz erklrt
PHP: PHP-Handbuch - Manual
MySQL :: MySQL 5.1 Referenzhandbuch

 

[mermshaus]

Wir haben hier angefangen, eine Übersicht zu erstellen: Quellensammlung ? Html.de wiki

 

[Signatura]

Danke

Hätte da eine andere Frage:

Möchte es jetzt anders lösen ich nehme nur ein bild , wie sollte ich es eurer meinung nach machen?
Ich arbeite mit Joomla, habe mir ein Modul zugelegt indem ich auch PHP und JS verwenden kann, also wie würdet ihr es machen?

Brauche das Bild in der oberen ecke links zentriert und ich möchte Text darüber schreiben den ich verlinken werde.

 

[Space Vampire]

...in der oberen ecke links zentriert...

entschuldige, aber: hä?!?
was denn nun?
oben links oder zentriert?

ansonsten ist die vorgehensweise genauso wie bei deinem ersten versuch mit zwei DIVs.

<p style="width:500px; height:250px; background-image:url('pfadzumbild.jpg'); background-position:top left; background-repeat:no-repeat;">
      <a href="ziel-url.html">Ich bin ein Textlink</a>
</p>

wenn du das hintergrundbild zentrieren willst, nimmst du statt top left eben center center

 

[Signatura]

Genau das war es, top left, vielen dank

Entschuldigt meine Unwissenheit. Wie kann ich in dem code noch das margin attribut reinbekommen? wo muss das eingefügt werden?

wichtig sind margin für links und oben

 

[Space Vampire]

wo möchtest du denn die margin haben?
auf dem text oder auf dem ganzen kasten?

die antwort ist: genau wie alle anderen style-angaben auch.
<style>tag im <head>
style=""attribut im betreffenden tag
oder ausgelagerte *.css

entweder

margin-top: 10px;
margin-left:10px;

oder

margin: 10px 0 0 10px;

beim unteren beispiel beginnen die angaben mit margin-top und dann im uhrzeigersinn um das element herum.

eine hintergrundgrafik kann man nicht mit einer margin versehen.
falls du das willst, musst du mit transparenten bildrändern arbeiten