Spendenbutton mittig setzen?

ZeroGravity

wie bekomme ich den Button "Spenden" in der Box mittig gesetzt?

Der Link lautet:
https://schritt-ins-leben.de

Liebe Grüße,
Zero

T1N0

In dem man sich mal mit CSS Vertraut macht und mittels Element Untersuchen die Klasse herausfindet.

Code

Klasse { text-align: center }

http://www.ich-lerne-css.de/Style/Examples/007/center.html

Du klickst den Spendenbutton mit der Rechten Maustaste an. Element Untersuchen und dann in der Konsole das Markierte mit der Rechten Maustaste anklicken und Eindeutigen Selektor kopieren und das verwendest Du für die Klasse.
https://developer.mozilla.org/de/docs/Tools/Seiten_Inspektor

ZeroGravity

Tino, ich habe so schon so viel mit allem zu tun, ich habe nicht noch die Zeit und den Kopf frei, CSS zu lernen. Wenn ich es versucht habe, bin ich nie damit weitergekommen.
Habe grad mal geschaut, hab es angeklickt, Element untersuchen, da ist nix markiert und mit dem Element .dashboardBoxSidebarButton funzt es nicht, was mich wundert.

Würde mich über Hilfe sehr freuen.
Wenn ich es selbst könnte würde ich hier nicht fragen.

T1N0

Bin Mobil Online und habe nur die TPL durchsucht. Theoretisch:

Code

#dashboardBoxSidebarButton .button { text-align: center }

ZeroGravity

Ne das geht auch nicht.
Meine Version sah etwas anders aus, die ging auch nicht.

T1N0

Auch nicht mit ?

Code

{ margin-left: auto; margin-right: auto; }

ZeroGravity

So geht es auch nicht:

Code

#dashboardBoxSidebarButton .button {    
text-align: center;    
margin-left: auto;   
margin-right: auto;
}

T1N0

Ich hab das jetzt mal Installiert das Plugin, bei mir ist der Button aber Standardmäßig Mittig?

Jedenfalls im Standarddesign.

Ps. Die Seite ist Mobil ein Graus. Der Banner überdeckt das Menü.

Cyperghost

Das ganze liegt auch nicht am Button sondern eher am Design.
Das Problem ist der vorherige Container eine mindestes Breite von 300px hat und somit das zu groß ist obwohl der Button richtig sitze.

So aber um dein Problem zu lösen sollte folgendes helfen.

CSS

fieldset.dashboardBox[data-box-name="de.wbb-elite.donation.button"] fieldset.dashboardBoxSidebarButton{
    width: auto;
    min-width: 100px;
}

ZeroGravity

Danke Cyperghost, das hat geholfen.
Jetzt sitzt es mittig.
Gucke mir später mal das Design mobil an.

zackOmat

Zitat von Cyperghost

Das ganze liegt auch nicht am Button sondern eher am Design.

Das liegt schon am Button, bzw. an deinem Templateaufbau.

Der Sidebarbutton weist eine definierte Breite von 300px auf, das ist dir ja bekannt, allerdings setzt du den jetzt in einen Container der ebenfalls mit 300px Breite definiert ist. Das wäre an sich kein Problem, allerdings besitzt das Fieldset Padding, dadurch passt es dann nicht mehr:

Den Aufbau so gibt es im WCF nicht, der Sidebarbutton steht immer frei, ohne umgebenden Container.

Der Spendenbutton ist in keinem Stil mittig das fällt nur nicht überall auf

Spendenbutton mittig setzen?

Cyperghost 27. Mai 2018 um 12:40

Cyperghost 15. August 2019 um 22:08

Informationen

Über uns