Text als Hintergrund

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Text als Hintergrund

    Hallo,

    ich habe folgendes HTMLs Layout:

    HTML Code:
    <div>
    	<dl>
    		<dd style="float:left; width: 200px;"></dd>
    		<dd style="float:left; width: 200px;"></dd>
    		<dd style="float:left; width: 200px;"></dd>
    	</dl>
    </div>
    Die <dd> bekommen per CSS noch ein Hintergrundbild zugewiesen. Ich möchte nun aber noch einen Text in den Hintergrund jedes DD-Elementes geben. Die <dd>-Elemente werden anschließend auch noch mit Text befüllt.

    Klar könnte man sagen, dass ich den Hintergrundtext doch einfach in das vorhandene Hintergrundbild integrieren könnte. Das Problem ist aber, dass sich der Text je nach User ändern kann, also sehr variable sein kann und ich nicht rund 50 Bilder erstellen will.

    Gibt es da eine elegantere Lösung?

    Gruß Tarlar

  • #2
    Der HTML-Code sieht kaputt aus. Ein <dd> ergibt ohne <dt> keinen Sinn.

    Comment


    • #3
      Du kannst es dir auch als <ul> / <li> Liste vorstellen. Das ändert allerdings an meinem Problem nichts

      Comment


      • #4
        So weit ich das überblicke, musst du ziemlich herumpfuschen. Also mit :before oder :after, inklusive eines eigenen Element sowie Angaben zu position und z-index. Imho solltest du dein Konzept überdenken.

        Peter
        Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
        Meine Seite

        Comment


        • #5
          Ich hab es nun so gelöst:

          HTML Code:
          <li>
          	<div style="height: 150px;">
          		<div style="height: 150px;">
          			Hier steht der Hintergrundtext
          		</div>
          		<div style="position: relative; top: -150px;">
          			Hier kommt der Inhalt hin.
          		</div>
          	</div>
          </li>

          Comment

          Working...
          X