Moin,

Wie im Bild zu sehen sind beider Blöcke gleich. Ich würde gerne den unteren Block tauschen. Sprich das Bild nach rechts und die 2 Textblöcke nach links. Der Text in den Textblöcken soll dann rechts ausgerichtet werden.

Der folgende Code sieht nach einer Art „Template“ aus, die in Deinem Beispiel zweimal verwendet wird. Damit die unterschiedlich sind, musst Du

• entweder zwei Templates daraus machen, die Du verwendest,
• oder mit CSS die Reihenfolge tauschen; @Rolf B hat dazu schon einen Tipp in Richtung CSS gegeben.

Ja, das habe ich gemacht. About me und About me2. In 2 habe ich es auch geschafft das Bild zu änder. Ich scheitere aber an der CSS, da die Formatierung dann absolut daneben ist 😟

Unabhängig davon möchte dieser Code aufgeräumt und modernisiert werden:

Ich habe es ja als WordPress Vorlage gefunden und auch so gekauft. Jetzt hat sich ja herausgestellt, das ist nur eine HTML-Vorlage. Wenn ich die Optik hinbekommen sollte, lasse ich sowieso den Validator darüber laufen und schaue mal, was der sagt. Wird sicherlich aber noch ein halbes Jahrhundert gehen 😂

<!-- ABOUT ME2 -->
      <section id="about" class="block-section">

Eine ID muss – das sagt schon der Name – eindeutig sein. Sofern das Template nicht noch irgendwie verarbeitet wird, gibt es in Deinem Beispiel anschließend zwei Sections mit der gleichen ID.

Werde ich nachher mal schauen, Danke. Eindeutige ID.

        <div class="clearfix my-profile">

Dieses div ist das einzige Kind der section, d.h. es ist sehr wahrscheinlich überflüssig.

          <div class="my-pict" >
            <div class="overfly">
              <div class="text-botttom">
                <h2 class="text-uppercase color-dark text-bold">Mister Mustermann</h2>
              </div>
            </div>
          </div>

Hierzu fällt mit das Zitat #2613 ein.

          <div class="my-desc">
            <div class="bg-secondary clearfix">
              <div class="inner-text">
                <p >Gemeinsam möchten wir dazu beitragen, dass sich jeder Tag für unsere Kunden besser anfühlt. Wir glauben daran, dass wahre Schönheit von innen kommt und dass ein gepflegtes Äußeres das Selbstbewusstsein stärkt. Deshalb nehmen wir uns die Zeit, zuzuhören und auf die Wünsche jedes Einzelnen einzugehen. Unser Ziel ist es, eine Atmosphäre zu schaffen, in der sich jeder wohl und verstanden fühlt. Ob bei einer Beratung, Behandlung oder einfach nur beim Austausch – wir möchten, dass unsere Kunden sich bei uns gut aufgehoben und inspiriert fühlen. Denn nur so können wir gemeinsam das Beste aus jedem Menschen herausholen und ihn auf seinem individuellen Weg begleiten.</p>
              </div>
            </div>

Noch mehr Matroschka-Code … Ist das dort eigentlich Dein Text oder ein Beispiel?

Ich arbeite dran, sowohl am Text als auch am Matroschka-Code 🙈

            <div class="bg-dark clearfix">
              <div class="inner-text">
                <p class="no-margin color-light ">
                  <strong class="fix-width-100"><i class="fa fa-calendar margin-right-5"></i> Geburtstag</strong> : 29.08.1978<br/>
                  <strong class="fix-width-100"><i class="fa fa-phone margin-right-5"></i> Telefon</strong> : +49 176 311 62 930<br/>
                  <strong class="fix-width-100"><i class="fa fa-envelope margin-right-5"></i> E-Mail</strong> : mustermann@example.com<br/>
                  <!--<strong class="fix-width-100"><i class="fa fa-location-arrow margin-right-5"></i> Adresse</strong> : 1234 Jalan Road, Fake City, IS 421 123.<--><br/>
                </p>
              </div>
            </div>

Mir scheint, dass dieser Text gerne eine Liste sein möchte (vielleichte eine dl). Dann kannst Du auch die Icons per CSS an die gewünschte Stelle generieren lassen ohne das i-Element von Font [not really] Awesome missbrauchen zu lassen. „Bei dem Aufwasch“ können dann auch die Leerzeichen vor den Doppelpunkten entfernt und eventuell Telefonnummer und Email verlinkt werden.

Interessant ist übrigens, dass die Adresse eine „Fake City“ angibt, die Email-Adresse allerdings anscheinend nicht.

          </div>
        </div>
      </section><!-- END ABOUT ME2 -->

Habt vielen Dank

Wofür auch immer 😉

Viele Grüße
Robert

Na, vielen Dank für eure Hilfe

Da die Visitenkarte es Online kommt, gabs da keine bewusste Verschleierung