Skip to content
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Logo
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Image position ueber CSS aendern

NEWS

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.1k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    1.8k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    15
    1
    2.0k

Image position ueber CSS aendern

Scheduled Pinned Locked Moved Visualisierung
8 Posts 2 Posters 1.5k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • M Offline
    M Offline
    mickyboys
    wrote on last edited by
    #1

    Moin,

    Habe dazu keine Antwort gefunden.

    Bei vielen Widgets kann man ein Image/ Bild einfuegen. Nun sind die Images aber oft fix - Wie kann ich die Position schieben, sprich das geladene Image innerhalb des Buttons damit es zentriert oder meinen Beduerfnissen gerecht wird, am besten ueber CSS, oder?

    In meinem Fall verwende ich das ctrl-icon-widget.

    Danke,

    Axel

    1 Reply Last reply
    0
    • HomoranH Do not disturb
      HomoranH Do not disturb
      Homoran
      Global Moderator Administrators
      wrote on last edited by
      #2

      Ist es das was du suchst?
      144_padding.jpg

      Gruß

      Rainer

      kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

      Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

      der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

      1 Reply Last reply
      0
      • M Offline
        M Offline
        mickyboys
        wrote on last edited by
        #3

        Moin,

        Ja genau, denke das waere genau das was ich brauche… im CSS Allgemein ist es nicht enthalten, also wohl ueber CSS, aber wie?

        Danke,

        Axel

        1 Reply Last reply
        0
        • M Offline
          M Offline
          mickyboys
          wrote on last edited by
          #4

          @Homoran:

          Ist es das was du suchst?

          padding.jpg

          Gruß

          Rainer `

          Funktioniert nicht.

          Also, ich habe ueber CSS den Button als Design erstellt. Bei den Widget einstellungen habe ich dann ein Bild eingefuegt, in meinem Fall ein Sender Logo. Dieses wiederum ist falsch positioniert, viel zu weit oben. Wenn ich jetzt das padding in den Einstellungen benutze aendere ich den ganzen Button und nicht nur Logo/ Icon…

          Warum muss alles so schwierig sein 😮

          1 Reply Last reply
          0
          • HomoranH Do not disturb
            HomoranH Do not disturb
            Homoran
            Global Moderator Administrators
            wrote on last edited by
            #5

            Ich weiß nicht wo du die Probleme hast.

            Mach doch bitte mal einen Screenshot.

            Ich habe ein stinknormales Bild eingefügt.

            Mangels installierter Icon-Sets in dieser Installation habe ich das flot Logo genommen.

            Unter Allgemein kannst du die Bildgröße (Icon-Größe) ändern.
            144_padding02.jpg

            Mit dem Padding kannst du die Abstände verschieben.

            Üblicherweise ist das Icon aber zentriert, wenn die Größe zum Button passt.

            Vorübergehend wird bei "unsinnigen" Werten beim Padding auch der Button vergrößert, den kann man aber wieder verkleinern.

            und dann die Bildgröße anpassen.

            Bitte mach einen Screenshot vor dem anpassen des paddings und eines danach, damit ich nachvollziehen kann, was du machst.

            Gruß

            Rainer

            kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

            Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

            der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

            1 Reply Last reply
            0
            • M Offline
              M Offline
              mickyboys
              wrote on last edited by
              #6

              what??? Das Kontingent für Dateianhänge ist bereits vollständig ausgenutzt.

              Ich kann nichts mehr hochladen…

              Das padding veraendert auch meinen Button, nicht nur das Icon.

              1 Reply Last reply
              0
              • HomoranH Do not disturb
                HomoranH Do not disturb
                Homoran
                Global Moderator Administrators
                wrote on last edited by
                #7

                @mickyboys:

                what??? Das Kontingent für Dateianhänge ist bereits vollständig ausgenutzt.

                Ich kann nichts mehr hochladen… `
                Da muss @Bluefox mal nachsehen 😞

                @mickyboys:

                Das padding veraendert auch meinen Button, nicht nur das Icon. `
                …und anschließend wieder mit der MAus auf die gewünschte Größe ziehen und das Icon anpassen!

                BTW ist das icon nativ vielleicht zu groß?

                oder hat es irgendwelche (unsichtbare) Ränder.

                Ich habe da keine Probleme.

                Gruß

                Rainer

                kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

                Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

                1 Reply Last reply
                0
                • M Offline
                  M Offline
                  mickyboys
                  wrote on last edited by
                  #8

                  Mhm, das ergibt nur ungenaue Ergebnisse. Ich frage mich wie man ueber CSS bei dem ctrl-icon widget die groesse des Icons separat zum Widget aendern kann. Ich kenne den Namen nicht ueber dem ich in CSS das padding ansteuern koennte.

                  Ueber Quelle wird es hinzugefuegt.

                  1 Reply Last reply
                  0
                  Reply
                  • Reply as topic
                  Log in to reply
                  • Oldest to Newest
                  • Newest to Oldest
                  • Most Votes


                  Support us

                  ioBroker
                  Community Adapters
                  Donate

                  608

                  Online

                  32.4k

                  Users

                  81.4k

                  Topics

                  1.3m

                  Posts
                  Community
                  Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                  ioBroker Community 2014-2025
                  logo
                  • Login

                  • Don't have an account? Register

                  • Login or register to search.
                  • First post
                    Last post
                  0
                  • Recent
                  • Tags
                  • Unread 0
                  • Categories
                  • Unreplied
                  • Popular
                  • GitHub
                  • Docu
                  • Hilfe