XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Styling Problem (http://xhtmlforum.de/showthread.php?t=64989)

Cyborg 23.06.2011 23:50

Styling Problem
 
Hallöchen

Ich habe ein kleines Styling Problem und bräuchte mal eure Hilfe.

Folgendes Bild wird mir mit folgenden Code erzeugt:

http://666kb.com/i/bum504v51pqf1fbe4.png
HTML-Code:

<table border="1">
<tr>
<td rowspan="2">
 <div style="margin-left:20px; margin-right:20px;">
 <img src="blau.png" alt="Leihvertrag" /></div>
</td>
<td>Hier steht ein kurzer Text.
</td>
</tr>
<tr>
<td valign="top"><a href="www.google.de">Das ist ein Link, der auch umbrechen kann.</a>
</td>
</tr>
</table>

Das Ziel ist es jetzt, dass die Pfeilspitze direkt auf die Mitte des Links zeigt. Auch wenn der Link umbricht.

Hätte da jemand eine Idee ?

threadi 25.06.2011 14:18

Verzichte auf die Tabelle und binde den Pfeil als Hintergrundbild für den Link ein. Dieses kannst Du dann mit background-position entsprechend ausrichten.

Cyborg 25.06.2011 15:06

Danke für deine Antwort.
Kannst du mir vielleicht noch einen Google-Tip geben ?

Ich finde irgendwie nicht wirklich einen Ansatz für mein Problem.

threadi 25.06.2011 15:17

SELFHTML: Stylesheets / CSS-Eigenschaften / Hintergrundfarben und -bilder

Um den Abstand vom Text zum Hintergrundbild zu erreichen, wäre padding noch sinnvoll.

Code:

a {
 background-image: url(pfeil.png);
 background-position: 50% 0%;
 padding-left: 200px;
}


kingz-art 28.06.2011 00:26

Jip.. meine Rede. Raus mit der Tabelle und über background-image lösen..

Cyborg 28.06.2011 00:45

Danke für den Tipp,

das Ganze sieht nun leider so aus ?!

http://666kb.com/i/buq8hwk0s587jsnzv.png

kingz-art 28.06.2011 01:00

lol.. kein Ding. Dir fehlt nur ne kleine Angabe. Hier mal der Code:
Code:

a {
background: url(pfeil.png) 0 50% no-repeat;
padding-left: 200px;
}

Kannst das auch alles in eine Zeile klopfen,.. als nur background: | dann die URL | dann die Position | dann das repeat

Und in Deinem Fall willst Du ja kein repeat haben.. deshalb no-repeat.

Denke so sollte es funzen... Grüßla

Cyborg 30.06.2011 11:19

hey kingz-art,

nochmal vielen dank.

jetzt sieht das ganze aber so aus

ohne umbruch:
http://666kb.com/i/buspj5rdse7d8w2hy.png
mit umbruch:
http://666kb.com/i/buspkcn54ulog897q.png

mermshaus 30.06.2011 20:35

Kannst du ein Livebeispiel irgendwo hochladen? Die Art der Stauchung der Grafik erscheint mir eigenartig.

Cyborg 30.06.2011 22:19

Bitteschön.

Bild mit Link

Ich wunder mich gerade, wieso das Ding auf einmal wieder in die nächste Zeile unter den Pfeil umbricht. Das war heute morgen noch nicht so :?


Alle Zeitangaben in WEZ +2. Es ist jetzt 08:05 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023