herrdeh: zwei Graphiken nebeneinander mittig zentriert in einem Container

Moinsen,

ich glaube, für einen Könner ist das einfach, aber ich bin halt keiner... (-;

Mein Projekt ist in grav (getgrav.org) realisiert, bin auch schon ganz zufrieden, muß allerdings die Vorlage etwas modifizieren.

grav verwendet twig, und die Seite wird aus einer twig-Vorlage, "default.html.twig" generiert. So sieht das Original aus:


        <div class="header-bottom">
          <div class="container">
            <div class="logo">
              {% block body_logo %}
                <a href="{{ base_url }}"><img src="{{ theme_config.logo_url | default(theme_url ~ '/assets/images/logo.png') }}" alt=" " /></a>
              {% endblock %}
            </div>

Zusätzlich zum linksbündigen logo.png soll nun noch ein rechtsbündiges logo2.png kommen - beide sollen horizontal mittig (nebeneinander) in dem "header-bottom" sitzen.

Im style.css findet sich:

/*--header-bottom--*/
.logo{
	float:left;
	margin-top: 1.2em;
	margin-bottom: 1.2em;
}

... aber das gleiche mit "logo2" und "float: right" nochmal drunter zu setzen bringt nichts, logo2 hängt dann am linken unteren Rand, wenn auch mit dem korrekten Abstand.

Nützliche Hinweise werden dankbar entgegengenommen! (-;

Beste Grüße, Wolf

  1. Hallo herrdeh,

    Nützliche Hinweise werden dankbar entgegengenommen! (-;

    Flexbox.

    Wenn du mehr wissen möchtest, erstelle ein online-Beispiel. Gern auch als Pen o.ä.

    Bis demnächst
    Matthias

    --
    Rosen sind rot.