Prinzip von Flexbox nicht ganz verstanden..

[Tabula_Rasa]

Hallo,

ich habe das Prinzip an sich verstanden aber in der Praxis fehlt es mir etwas schwer.
Sagen wir mal wir haben drei verschachtelte Divs, so ungefähr:

<div class="container">
<div class="content-container">
<div class="content">
Hi
</div>
</div>
</div>

.container{
    display:flex;
    max-width: 800px;
    margin-left:auto;
    margin-right:auto;
    margin-top: 10rem;
    height: 1000px;
    border:3px solid;
    background-color: #0d2e70;
    
.content {
     background-color:#ffbf00;
     }
    
    .outercontent {
    background-color:black;
    padding: 0.1rem 0.1rem 0.1rem 0.1rem;
    margin-left: 0.2rem;
    margin-right: 0.2rem;
    margin-top: 2rem;}
}

Der Container passt jetzt die Breite an, jedoch ändert sich der Content total. Die Klasse Container-Content habe ich da nur eingefügt um noch einmal einen farbigen Rand zu erzeugen also wegen des Designs. Das Problem ist, dass sie nicht mehr von links nach rechts verläuft, wo dann der Inhalt stehen soll, sondern von oben nach unten. Ohne Display:flex; siehts dann wieder so aus, wie es aussehen soll.

Tut mir wirklich leid. Ich muss euch wirklich auf die Nerven gehen.

Vielen Dank

Edit: Ich habe da einiges ausprobiert, aber möchte nicht zeigen, was ich so ausprobiert habe, weil es für euch bestimmt ziemlich absurd erscheinen wird

 

[MrMurphy]

Hallo

Auf die Nerven geht deine Faulheit deine Quellcodeschnipsel wenigstens noch einmal durchzulesen und zu korrigieren.

Im HTML gibt es die Klassen container, content-container und content.

Im CSS dann container, content und outercontent.

ich habe das Prinzip an sich verstanden

Leider nicht mal ansatzweise.

Du hast drei in sich verschachtelte Container.

Flexbox ist jedoch dafür gedacht mehrere Container innerhalb eines anderen Containers anzuordnen.

Für deinen Quelltext ist Flexbox somit sinnlos.

Gruss

MrMurphy

 

[Tabula_Rasa]

Hey,

okay jetzt weiß ich, dass ich das nicht verstanden habe - schon mal etwas Gutes . Ebenso habe ich was Neues gelernt

Im HTML gibt es die Klassen container, content-container und content.

Im CSS dann container, content und outercontent.

Bis jetzt hat es sich gelohnt, diese Frage zu stellen, auch wenn ich dabei auf die Nerven gehe (tut mir wirklich leid :) ).

Die Frage die sich mir stellt: Wie lernt man richtig? Ich weiß nicht, wie ich lernen soll und habe Probleme dabei, nicht dass es eure Probleme wären, aber da ihr bzw. du sehr viel Erfahrung hast, würde ich mich über ein Tipp von einem Profi freuen. Wenn man das Grundgerüst usw. kennt, soll man dann einfach anfangen zu "programmieren" und wenn es Probleme gibt, eine Antwort zu diesem Problem finden, oder wie soll man vorgehen?

Auch wenn es jetzt nicht so rüberkommt, möchte ich nachhaltig etwas lernen.

Ich habe noch eine Frage zu den Klassen: Wenn ich die Klassen container, content-container und content habe, wieso werden im CSS andere Bezeichnungen verwendet. Die Klasse, für die man den CSS-Code produziert wird doch mit einem "." angekündigt, die Bezeichnung bleibt doch dann gleich?

Danke für deine ehrliche Antwort.