Unterschied Align-Items und Text-Align?

Wann und wo verwendet man das eine und wann das andere?

1 Antwort

Von Experte Babelfish bestätigt

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

Webseite, Programmieren & Softwareentwicklung

25.11.2023, 16:50

align-items wirkt sich nur auf HTML-Elemente innerhalb einer Flexbox aus. Siehe: https://developer.mozilla.org/en-US/docs/Web/CSS/align-items?retiredLocale=de

text-align wirkt sich auf Inline-Elemente sowie Text innerhalb beliebiger HTML-Elemente aus. Siehe: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align?retiredLocale=de

Woher ich das weiß:Berufserfahrung – mit dem Internet verbunden seit 1993

MarlonStrich

Fragesteller

25.11.2023, 17:36

Und wenn ich in einem DIV ein weiteren DIV mit einem IMG habe und noch einen DIV mit Text ( also p Tag ) wie zentriere ich das? Mit align item zentriert sich ja da der Container und nicht der Inhalt oder?

threadi

25.11.2023, 20:56

@MarlonStrich

Den Text im p mit text-align.

Für eine bessere Antwort müsste man wissen wie du die Elemente bereits positionierst. HTML-Dateinamen sagen nichts aus.

Ähnliche Fragen

HTML Text verschieben?

Ich möchte den text horizontal mittig haben justify-content und align-items gehen beide nicht


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <style>
        .WelcomeTitle {
           display: flex;
           flex-direction: column;
          
            text-align: center;
            align-items: center;
            font-family: sans-serif;
        }
    </style>
    <h1 class="WelcomeTitle">Hier kommt ein Titel
        <br>
        hin der Lang ist!</h1>
</body>
</html>

...zur Frage

H1 in der Mitte ausrichten?

Mit text-align hab ich meinen h1 zentriert. Wie bekomm ich ihn aber, dass er nicht nur oben in der Mitte ist sondern in der Mitte Mitte, also im mitten Bildschirm oder Tab?

...zur Frage

CSS Text Mittig ausrichten trotz max-width?

Hi,

also ich habe ein Text erstellt, und habe diesem gesagt "text-align: center", und eine max-width: 20%;

Aber ernimmt zwar jetzt die 20% max-width, aber zentriert den Text nicht mehr Links?

warum?

...zur Frage

Textfeld in die Mitte bringen?

Bei meiner Webseite würde ich gerne die Überschrift die einen farbigen Hintergrund hat in die Mitte verbschieben. Und ich weiss um den Text in die Mitte des Textfelds zu bekommen muss ich text-align: center; schreiben aber wie bring ich dann noch das Textfeld in die Mitte der Seite?

...zur Frage

Wie kann ich die Punkte von einer <ul> auch zentrieren?

Ich habe bereits für die Liste: text-align: center; , justify-content: center; und align-items: center;.

...zur Frage

text-align funktioniert nicht?

Hey Leute, ich versuche zurzeit eine Website mit Atom zu erstellen. HTML und CSS.

Ich brauch zurzeit den "Command" text-align. Aber irgendwie funktioniert dieser nicht. Und wir nicht mal aufgelistet. Woran liegt das?

http://prntscr.com/k67npb

...zur Frage

Was ist der Unterschied zwischen Referenz- und Zeigersemantik (in C++)?

Und zu welchem Zweck wird welche dieser Semantiken verwendet?

lg Kath

...zur Frage

HTML - Text vertikal zentrieren?

Hat jemand von euch eine Idee warum die Überschrift nicht mittig zentriert wird? Ich habe es mit vertical-align, align-content und align-items usw probiert aber nichts zeigt einen Effekt.

https://images.gutefrage.net/media/fragen/bilder/html---text-vertikal-zentrieren/0_big.png?v=1516395008803"/>

...zur Frage

Unterschied Scanner und BufferedReader?

"BufferedReader verwendet Zeichenströme, um Text aus der Eingabe zu lesen, während Scanner verwendet werden kann, wenn wir die primitive Art der Eingabe haben."

https://www.delftstack.com/de/howto/java/user-input-java/

Habe ich so im Internet gefunden, allerdings verstehe ich den Unterschied immer noch nicht. Zum Beispiel verstehe ich nicht, welchen Datentyp die Eingabe hat.

Was ich auch nicht verstehe: Scanner kann doch auch bei nicht-primitiven Arten verwendet werden, z.B. bei Strings mithilfe der nextLine()-Methode.

LG Kath

...zur Frage

Wie kann ich mit HTML einen Text bündig untereinander schreiben?

Habe ein bild angehangen . Würde gerne die speiseliste bündig untereinander haben jedoch funktioniert das Align=Center nicht

...zur Frage

Ein befehl für „Text-align:“ in HTML, damit man selber entscheiden kann?

Hallo.

Kann man bei „Text-align:“ selber entscheiden, wie weit man den Text/Buchstaben zum Beispiel nach rechts zieht?

text-align: right; ist der Buchstabe halt rechts auf der Seite. Ich will aber zum Beispiel selber entscheiden um wie viel Prozent er sich nach rechts bewegen soll? Z.B: text-align: right 70%;

Ihr versteht schon. 😅

Geht das mit text-align: oder muss Ich margin benutzen?

...zur Frage

text-align:center; funktioniert nicht?

Ich versuche schon seit geraumer Zeit dieses Problem zu lösen, doch ich komme einfach nicht dahinter, vielleicht kann mir hier jemand netterweise bei meinem Problem weiterhelfen.

<!DOCTYPE html>                             
<style>
  body{
    font-family: Georgia, 'Times New Roman', Times, serif;
  }
  
 #top{
  text-align: center;
 } 
  
 #logo{
    color:rgb(255, 255, 255);
    background-color: crimson;
    display: inline-flex;
    font-size: 32px;
    font-weight: bold;
    padding: 8px;
    margin-top: 16px;
  }
  #logo-name {
font-size: 32px;
font-weight: bold;
margin: 16px;
text-align: center;
  }
</style>
<html>
  <head>
<title> Homepage </title>
  </head>
<body>
  <div id="top"></div>
  <div id="logo">OH</div>
  <div id="logo-name">Homepage</div>
  <div id="main"></div>
  <div id="footer"></div>
</body>
</html>

...zur Frage

Text unter Bild in HTML hinzufügen?

Ich habe ein Bild. Darunter habe ich ein Text platziert. Allerdings geht der Horizontal von links nach rechts, was es auch soll. Nur soll er da anfangen, wo auch das Bild beginnt und enden, wo das Bild endet. In den zwei Bildern könnt ihr erkennen, wie es es gerade habe und nicht will und wie ich es gerne haben würde.

<!DOCTYPE html>
<html>
<head>
    <title>Film- und Serienbeschreibungen</title>
  


  <style>
    img {
        display: block;
        margin: 0 auto;
        width: 1000px;
        border-radius: 10px;
    }


    body {
        text-align: center;
    }


    p {
        
    }
  </style>
</head>
  <body>
    <img src="mrrobotscene.jpg">
    <h1>Mr. Robot - Beschreibung</h1>
    <p>Mr. Robot ist eine US-amerikanische Fernsehserie, die von Sam Esmail entwickelt wurde. Die Serie handelt von Elliot Alderson, einem jungen Programmierer, der für eine Cyber-Sicherheitsfirma arbeitet und in seiner Freizeit zum Hacker wird. Elliot leidet unter sozialen Ängsten und Depressionen und verfällt in eine Art Schizophrenie, die von seinem imaginären Freund, Mr. Robot, ausgelöst wird</p>
    
  </body>
</html>

...zur Frage

Welchen Text-Editor verwendet ihr für HTML?

Um ein HTML-Dokument zu erstellen reicht ja ein Text-Editor aus! :)

Welchen Editor verwendet ihr dafür?

Den Standard-Editor (z.B. "notepad" von Microsoft/Windows) oder einen Anderen? Es gibt ja inzwischen gefühlt 100+ verschiedene Editoren! :)

Mit Text-Editor meine ich ein "einfaches" Text-Programm - auch wenn es um HTML geht. Ich meine damit ausdrücklich keine (!) WYSIWYG-Programme.

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen