WebSite X5Help Center

 
C K.
C K.
User

Hover Button Ausrichtung  de

Auteur : C K.
Visité 158, Followers 1, Partagé 0  

Hallo,

Wenn man mit dem Hover Button-Objekt einen Link erstellt, wird der Linktext immer zentriert. Das macht die Ausrichtung, z.Bsp. für linksbündig, extrem schwierig.
Kann man die Linktextausrichtung definieren/ändern oder übersehe ich da etwas?

Danke für Tipp
Claudio

Posté le
15 RéPONSES - 4 UTILE
Daniel W.
Daniel W.
User
Meilleur utilisateur du mois DEMeilleur utilisateur du mois EN

Ich hole mal den Post nach oben, damit er nicht vergessen wird.

Vielleicht können CSS-Experten, die das Objekt "Hover Button" haben, mit CSS-Code helfen.

Lire plus
Posté le de Daniel W.
Siegbert G.
Siegbert G.
User

Hallo Claudio,

ich weiß nicht ob du diese Ausrichtung meinst.

Versuch mal unter 4 Ränder, Ausrichtung.

Lire plus
Posté le de Siegbert G.
C K.
C K.
User
Auteur

Vielen Dank, Daniel, sehr nett.

Danke auch dir, Siegbert. Ich habe deine Idee getestet, funktioniert nicht.

Hier ein Beispiel:

1 = Textobjekt, linksbündig
2 = Hover-Button, ohne Änderung
3 = Hover-Button mit Rand links 1, alle anderen Ränder 10
4 = Textobjekt, ohne Änderung


Wenn man nun alle Objekte (die Text) linksbündig ausrichten will, ist das eine ziemlich Bastlerei. Wenn man auch nur Hover-Buttons linksbündig ausrichtigen will, ist das ziemlich nervig, wenn der Linktext in den Buttons unterschiedlich lang ist.

Aber vielleicht sehe ich die Lösung einfach nicht.

Vielen Dank.

Lire plus
Posté le de C K.
Siegbert G.
Siegbert G.
User

Ah, du meinst den Text im Button selber.

Lire plus
Posté le de Siegbert G.
C K.
C K.
User
Auteur

Ja, genau. der Linktext im Button. Wenn man z.Bsp. in einer Fusszeile Links platziert und diese linksbündig anordnen will, ist das ziemlich umständlich zu machen.

Lire plus
Posté le de C K.
Daniel W.
Daniel W.
User
Meilleur utilisateur du mois DEMeilleur utilisateur du mois EN

Habe mir mal das Objekt "Hover Button" (8 Credits) gekauft und erfolgreich mit CSS-Code getestet.

Kleine Anleitung:

Im Raster das Objekt "Hover Button" mit einem Klick markieren und oben auf "Code" klicken, hier dann den CSS-Code wie im Screenshot unten einfügen.

.

----- Verwendeter CSS-Code -----

#pluginAppObj_32_10 .flex-container {
justify-content: left;
margin-left: 5px;
}
</style>

Hinweis: Die Zahlen 32_10 sind je nach Nutzer und Objekt unterschiedlich.

----- Screenshot -----

Lire plus
Posté le de Daniel W.
Daniel W.
Daniel W.
User
Meilleur utilisateur du mois DEMeilleur utilisateur du mois EN

Korrektur:

Das </style> beim CSS-Code ist in diesem konkreten Fall ein Fehler und deshalb weglassen.

Lire plus
Posté le de Daniel W.
Daniel W.
Daniel W.
User
Meilleur utilisateur du mois DEMeilleur utilisateur du mois EN

Probleme gibt es bei mehrzeiligen Buttons, siehe

Hier im Beispiel die kürzere 1. Zeile mit geschützten Leerezeichen auffüllen, siehe Screenshot unten, damit es auf der Seite dann so aussieht.

-----

Lire plus
Posté le de Daniel W.
Daniel W.
Daniel W.
User
Meilleur utilisateur du mois DEMeilleur utilisateur du mois EN

Hier noch das geschützte Leerzeichen zum Kopieren:

&nbsp;

Vielleicht haben die CSS-Experte eine Lösung, die ohne geschützte Leerzeichen auskommt.

Lire plus
Posté le de Daniel W.
Bernhard K.
Bernhard K.
User

Hallo Daniel

Wie hast das mit der barrieresachen einbaut? Woher hast das denn? Ist das gesetzeskonform? Was kostet das? Schwer zum einbauen?

Lire plus
Posté le de Bernhard K.
C K.
C K.
User
Auteur

Vielen Dank, Daniel! Genau diese Lösung habe ich gesucht und gleichzeit wieder was sehr Hilfreiches dazugelernt. Sehr gut.

Nochmals besten Dank & Gruss

Lire plus
Posté le de C K.
Andreas S.
Andreas S.
Moderator

Hallo Bernhard,

schau mal hier.... LINK

Lire plus
Posté le de Andreas S.
Daniel W.
Daniel W.
User
Meilleur utilisateur du mois DEMeilleur utilisateur du mois EN

Den Link zum kostenlosen Tool hat Andreas schon gepostet.

Kleine Anleitung:

Den kopierten Code des kostenlosen Tools in WebSite X5 unter ...

     1 Einstellugen > Statistiken und Code / Code

        Benutzerdefinierter Code:

        Vor dem </BODY> Tag

             <script src="https://website-widgets.pages.dev/dist/sienna.min.js" defer></script>

... einfügen.

Lire plus
Posté le de Daniel W.
Bernhard K.
Bernhard K.
User

DANKE

Das ist alles umsonst? kaum zu glauben....

Lire plus
Posté le de Bernhard K.