Css backgroundimage Frage

    Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

    • Css backgroundimage Frage

      Hi,
      ich habe ein Frage, und zwar komme ich einfach bei einem Problem nicht weiter.
      Ich will einen Button machen, dazu habe ich ein Hintergrundbild:
      [Blockierte Grafik: http://img106.imageshack.us/img106/2531/mybuttonsva4.png]

      jetzt will ich, dass das Hintergrundbild je nach länge des textes im Button seine runden Ecken "verschiebt"
      . Das mag verrückt klingen, aber ich weiß das es funktioniert... nur leider nicht wie.
    • Hallo,

      schau mal hier: Css backgroundimage Frage. Dort wird jeder fündig!

      Registrieren bzw. einloggen, um diese und auch andere Anzeigen zu deaktivieren
    • ich bin kein HTML/CSS Experte aber ich meine mich zu erinnern das dies geht wenn du 3 Bilder hast, die beiden Enden und ein kleines Mittelstück. Je nach länge des Textes werden dann mehr Mittelstücke eingesetzt. Wie die genauen CSS Anweisungen dafür lauten kann ich dir aber nicht sagen.
      Das Internet ist ein gefährlicher Ort, und Windows-Nutzer wissen, dass man eine Rüstung tragen sollte. Apple-Nutzer tragen stattdessen Hawaii-Hemden.
      Jewgenij Kaspersky
    • danke, ich habe es jetzt herausgefunden.
      Der Button in HTML sieht so aus:

      Quellcode

      1. <a class="button"><span>Hallo, klick mich, ich bin ein Button</span></a>


      Der CSS Teil ist ein bisschen kompliziert, drum erkläre ich nur den Umriss.
      Also, es funktioniert so, dass der button eine Hintergrundtextur hat, bei der die runde Ecke links ist, siehe oben.
      Der Span Tag hat die selbe Textur, aber bei background-position gibt man

      Quellcode

      1. background-position:100% 0;
      ein. Dadurch hat sein Hintergrundbild die rechte runde Ecke an der echten Seite.Jetzt muss man nur noch mit Margin und padding rumexperimentieren:)

      Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von scripwidgets ()