CSS WP Wooc. Adresse rechtsbündig als Block für Rechnung

  • [FONT=&quot]Hallo,[/FONT]
    [FONT=&quot]möchte meine Adresse rechtsbündig haben, der Text soll aber von links mit dem gleichen Abstand starten.[/FONT]

    <div style="text-align: right">
    <p style="text-align: left; display: inline-block;">
    Dieser Text soll<br />
    So rechtsbündig<br />
    Wie eine Adresse<br />
    Aufgelistet stehen
    </p>
    </div>

    leider zeigt er mir den Text trotzdem links an.

  • gut hab das Problem selber gelöst, falls es jmd interessiert, so gehts schneller:
    <span style="margin-left: 90em">Firma
    <span style="margin-left: 90em">Straße
    <span style="margin-left: 90em">Ort
    <span style="margin-left: 90em">Land

  • Jep.. gute Idee - aber nur auf dem ersten Blick! Auf dem Zweiten erkennt man doch deutliche Nachteile. Dieses Konstrukt sieht vielleicht nur auf deinem Monitor gut aus... alle anderen sehen vielleicht nichts, weil du die Adresse mit dem Margin aus dem Anzeigebereich geschoben hast ... oder die Adresse ist irgendwo, nur nicht rechtsbündig.
    Kannst du näher beschreiben, wie das Ganze aufgebaut sein soll?
    So was wie ein Briefkopf? Also wo links neben der Adresse noch irgendwelche Inhalte sein sollen - oder soll der freie Platz links ungenutzt bleiben?

    - - - Aktualisiert - - -

    Ach übrigens ... der Code aus deinem Anfangspost funktioniert!
    Kann es sein, dass du auf deiner Seite noch andere CSS-Codes hast, die dir hier in die Quere kommen?

    if(!sleep)

    {$sheep++;}

  • Hallo Sailor,
    ja genau das Problem ist aufgetreten und wird kenntlich, wenn man die Rechnung generiert und als PDF abspeichert. Dort sind die Wörter irgendwo verteilt.
    Ja es sollte der Adresskopf sein, der rechtsbündig aufgeführt werden soll. Wie gehe ich da Code-technisch am besten ran? eine Lsg?
    Ja jede Zeile ist per CSS mit eingabewerten vom system verknüft also zb. Rechnungsnummer wird generiert name, anschrift, ect. nur von der eigenen adresse ist alles statisch.

  • So würde es formations technisch auch fürs PDF perfekt klappen, allerdings fängt er mit den wörtern nicht auf der gleichen vertikalen an sonder schreibt die wörter rechtsbündig. der block wird aber rechtsbündig angezeigt, die wörter leider nicht linksbündig.


    <table style="border: 0">
    <tr style="border: 0">
    <td align="right">Name</td>
    </tr>
    <tr style="border: 0">
    <td align="right"> Straßenname</td>
    </tr>
    </table>

  • Dann versuche bitte mal folgendes, um deinem Adressblock etwas besser in den Griff zu bekommen und weniger abhängig von anderen Elementen zu machen, nehmen wir den Code von oben, schmeißen da die Inline Styles raus und geben dem <div> eine ID---

    HTML
    <div id="adresse">
      <p>
        Dieser Text soll<br>
        So rechtsbündig<br>
        Wie eine Adresse<br>
        Aufgelistet stehen
      </p>
    </div>


    und dann musst du dieses CSS noch in dein Stylesheet unterbringen - ganz ans Ende anhängen.

    HTML
    #adresse {
       text-align: right;
    }
    
    
    #adresse p {
       text-align: left;
       display: inline-block;
       padding: 5px 20px 5px 0px;
    }


    Das 'padding' soll dafür sorgen, dass der Block nicht zu sehr am rechten Rand 'klebt'.

    if(!sleep)

    {$sheep++;}

  • Meine das müsste als html irgendwie machbar sein, dass 4 wörter als block rechtsbündig auf einem pdf file angezeigt werden. habe es nicht ausprobiert, weil ich den css nicht dort unterbringen kann.

  • Du nutzt doch WordPress - oder? Sagt dir der Begriff 'zusätzliches CSS' irgendwas?

    Externer Inhalt www.youtube.com
    Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.
    Durch die Aktivierung der externen Inhalte erklären Sie sich damit einverstanden, dass personenbezogene Daten an Drittplattformen übermittelt werden. Mehr Informationen dazu haben wir in unserer Datenschutzerklärung zur Verfügung gestellt.

    if(!sleep)

    {$sheep++;}

  • sehe grad es ist php. hier könnte es geändert werden. das ist der aktuelle urspungs code:


    <div class="order-addresses<?php if( !wcdn_has_shipping_address( $order ) ) : ?> no-shipping-address<?php endif; ?>">
    <div class="billing-address">
    <h3><?php _e( 'Billing Address', 'woocommerce-delivery-notes' ); ?></h3>
    <address>


    übrigends, dein code funktioniert auch.

  • Wenn du einen funktionierenden Code hast, dann solltest du tunlichst die Finger vom PHP und den darin aufgerufenen WordPress Funktionen lassen - es sei denn, du weißt ganz genau was du tust!
    Wenn du doch meinst, du müsstest das tun, dann lege dir vorher ein Backup an ... erzeuge ein Child Theme und mache deine Änderungen dort!
    Oh oh... wenn das mal nicht schief geht :(!

    if(!sleep)

    {$sheep++;}

  • Ich versteh nicht, was du fragen willst? Der Code in deinem ersten Post hat ja nicht funktioniert... wegen der Inline-Styles vermute ich... was soll da jetzt (nicht) funktionieren, wie in deinem ersten Post ???

    if(!sleep)

    {$sheep++;}

  • Erstmal danke Sailor für deinen Ratschlag. Das hat gut funktioniert, allerdings setzt er das logo in der gleichen Zeile mit dem Block text rechtsbündig.
    Bei folgendem Code ist komischerweise die order-adresse links und in gleicher Zeile das Logo rechts, zudem wird die liefer/rechnungsadresse gleich unter das logo rechts gequetscht obwohl ich einen bottom abstand habe:


    Einmal editiert, zuletzt von newbee2018 (27. Juni 2018 um 14:28)

  • Sory... aber mit diesen Codeschnipseln kann ich nichts anfangen... es gehören immer HTML und CSS zusammen - und das gilt gerade bei diesen WP Installationen, wo jedes Plugin noch zusätzlichen Code in die Seite schreibt.
    Also wenn du weiter Hilfe brauchst, wird das ohne einen Link zur Seite nicht gehen! Und natürlich eine konkrete Problembeschreibung... ich weiß ja nicht, welche Adresse und welches Logo du wo... links.. rechts .. oben oder unten haben möchtest.

    if(!sleep)

    {$sheep++;}