[3.3] Position des Logos verändern

[stefan-franz]

Hallo, welche Parameter muss ich in welcher Datei verändern, wenn ich das Bild "Online Academy" (links oben) in meinem Board
https://pm-focus6-team.de/
etwas nach oben und weiter nach links setzen will?

[Kirk]

Hallo
Finde in der common.css das hier:

Code: Alles auswählen

.site-description {
    float: left;
    width: 65%;
}

Ersetzen mit:

Code: Alles auswählen

.site-description {
    float: left;
    width: 98%;
    padding-left: 8px;
}

Finde:

Code: Alles auswählen

.logo {
    float: left;
    width: auto;
    padding: 10px 13px 0 10px;
}

Ersetzen mit:

Code: Alles auswählen

.logo {
    float: right;
    width: auto;
    padding: 10px 13px 0 10px;
}

Die Feinabstimmung musst du dann mit den padding Werten machen.
Als Alternative könntest du die EXT Sitelogo responsive nehmen.

[Talk19zehn]

In meiner Leichtigkeit wäre lediglich dies zu ändern: Abstände (padding) passen sodann bei genauer Untersuchung (lediglich mittels Browser-Tool).

Code: Alles auswählen

.logo {
  float: left;
  width: auto;
  padding: 2px 13px 0 4px;
}

Als Gast sieht man die Suche nicht, was in meinem Ansinnen noch keinen Sinn machen kann, .site-description prozentual zu ändern oder andersartig das Logo zu floaten. Wenn Events dort ins Spiel kommen könn(t)en, ergäbe dies m.E. einen Umbruch und zieht die Klasse headerbar auf.

Reine unverbindliche Erfahrungswerte. Dein Ziel mag ein anderes sein. Viel Glück.

[stefan-franz]

In meiner Leichtigkeit wäre lediglich dies zu ändern: Abstände (padding) passen sodann bei genauer Untersuchung (lediglich mittels Browser-Tool).

Code: Alles auswählen

.logo {
  float: left;
  width: auto;
  padding: 2px 13px 0 4px;
}

Was bedeutet diese Padding Werte: 4 Koordinaten? Abstände von bis?: 2px 13px 0 4px;

[chris1278]

Hier mal was lesestoff.

https://blog.hubspot.de/website/css-pad ... %20angeben.

[Talk19zehn]

Hallöchen: oben, rechts, unten, links ...

Wenn das Bild "Online Academy" (links oben) in deinem Board etwas nach oben und weiter nach links gesetzt sein soll: Beispiel (probiere es einfach aus).

Code: Alles auswählen

padding: 2px 13px 0 4px;

Das Original findest du in der common.css:

Code: Alles auswählen

.logo {
  float: left;
  width: auto;
  padding: 10px 13px 0 10px;
}

BTW:
Und, es kommt immer auf den DIV-TAG (Container) an, den du bestückst. Margin-Werte vererben sich bspw.
Und/oder Float, Flex etc. pp. können einem das Leben mit den Abstandsregeln erschweren. Es gibt zig-fache Konventionen.

Viel Glück!