Button zentrieren

Dieses Thema im Forum "StyleEdit" wurde erstellt von bemark, 27. Mai 2022.

  1. bemark

    bemark Erfahrener Benutzer

    Hallo zusammen

    Ich versuche einen Button in einer Sektion oder Spalte zu zentrieren. Im Forum habe ich die CSS

    #buttonfa3p3n062,#buttonydnw8su3g,#buttonknfycrw0o{margin-left:45%;}

    gefunden und auch eingefügt.

    Ich habe es mit {text-align: center;} versucht, jedoch ohne Erfolg. Eigentlich wäre es gut, wenn im StyleEdit 4 eine solche Einstellung als Standard möglich ist.

    Ich danke für eure Hilfe.
    Gruss
    Rolabd
     
  2. barbara

    barbara G-WARD 2014-2020

    sind das denn auch die IDs Deiner Button?
    Wenn nicht hat das keinen Wert.

    Gib eine eindeutige Bezeichnung g in die Klasse ein und setzte noch ein "center-block" an.
    dann steht als klasse z.B. "start-button center-blcok" (ohne ")

    damit der Button nciht über die ganze Breite geht, kannst du im eigenen css das schreiben:
    Code:
    .btn.start-button{
      width: 250px;
      }
    die 250px musst du noch nach dem Text anpassen.
     
  3. bemark

    bemark Erfahrener Benutzer

    Vielen Dank Barbara, es hat geklappt.

    Geht das evtl. auch vertikal bei einer Spalte mit Hintergrundbild oder direkt über einem Bild? Das heisst der Button ist immer in der Mitte vom Bild.

    Vielen Dank und Gruss
    Roland
     
  4. barbara

    barbara G-WARD 2014-2020

    die css - Zeile wäre
    vertical-align: middle;
    Ich kann Dir nur nicht sagen zu welchem Bereich Du das packen musst, oder ob das hier funktioniert.

    Du kannst es aber auch mit
    margin-top: 100px:
    versuchen
    das kommt zur Breite des Button, vor die }
     
  5. bemark

    bemark Erfahrener Benutzer

    Vielen Dank Barbara, ich werde die Varianten testen..
     
  6. Anonymous

    Anonymous Erfahrener Benutzer

    Hallo ihr beiden,
    ich würde gerne auch 2 Buttons zentrieren, komme da aber nicht weiter. Würdet ihr mir genau sagen, was ich im CSS eintragen muss? Die IDs der beiden Buttons werden mir ja angezeigt.

    Über eure Hilfe freue ich mich sehr und wünsche einen schönen Sonntag
     
  7. barbara

    barbara G-WARD 2014-2020

    Du musst eine Klasse vergeben, die Du bei beiden Button einträgst.
    und dann kommt ins css
    .btn.DeinKlassenname{
    ...
    }
     
  8. Anonymous

    Anonymous Erfahrener Benutzer

    Hallo Barbara,
    vielen lieben Dank, für Deine Antwort. Aber.. wie erstelle ich eine Klasse?
    Ich bin da leider nicht bewandert...
     
  9. Anonymous

    Anonymous Erfahrener Benutzer

    Ich habe es hinbekommen. nach einer anderen Anleitung, die ich im Forum gefunden habe. Herzlichen Dank für Deine Mühe am Sonntag!